IndexedDB、CacheStorage 与 localStorage 如何选择？浏览器容量是多少？
先理解原理和示例，再练习完整口述与追问。
回答要点
localStorage 同步字符串；IndexedDB 异步结构化事务存储；CacheStorage 保存请求响应；容量因环境变化；处理配额与驱逐。
原理拆解
localStorage 是同步字符串键值存储，适合少量设置，不适合大对象和频繁写入，因为序列化与同步访问会占用主线程。IndexedDB 是异步结构化存储，支持对象仓库、索引和事务，适合离线数据、较大数据集和可查询记录；不应误以为它能直接持久化任意 JavaScript 函数。CacheStorage 按请求保存 Response，常用于 Service Worker 资源缓存，也可以由满足条件的页面访问，它不是通用关系数据库。
浏览器容量和回收策略取决于浏览器、磁盘、来源、浏览模式与权限，不能统一回答“每站最多 50MB”或“无限容量”。navigator.storage.estimate 可以估算某些来源存储的 usage 与 quota，结果不等于精确可用字节；persist 可以申请持久存储待遇，但不保证获准，也不代表用户永远无法删除数据。
写入应捕获 QuotaExceededError，设置容量或条数上限、版本、过期和淘汰策略，先清理可重建数据，并明确提示不可丢失内容的保存状态。隐私模式、用户清理或空间紧张都可能导致数据消失，关键业务数据仍要有服务端同步或导出方案。同源存储也不能抵御同源 XSS，因此敏感令牌需要按整体威胁模型选择存放方式。
示例与推演
离线表单记录需要按 ID 查询与事务更新，适合 IndexedDB；静态脚本与接口 Response 按缓存策略保存，适合 CacheStorage；主题等少量设置可用 localStorage。写入配额失败时清理可重建缓存，并明确告知用户草稿是否保存，而不是 catch 后仍显示成功。
易错点
配额估算不是预留容量的承诺。认证响应、用户私有数据的缓存应按账号隔离，退出与权限变化需要清理。
参考回答可直接练习口述
localStorage 是同步字符串键值存储，适合少量设置，不适合大对象和频繁写入，因为序列化与同步访问会占用主线程。IndexedDB 是异步结构化存储，支持对象仓库、索引和事务，适合离线数据、较大数据集和可查询记录；不应误以为它能直接持久化任意 JavaScript 函数。CacheStorage 按请求保存 Response，常用于 Service Worker 资源缓存，也可以由满足条件的页面访问，它不是通用关系数据库。