IndexedDB是一种在客户端存储大量结构化数据的Web API，它是HTML5中的一个新特性。IndexedDB允许web应用程序在本地存储大量的数据，并且可以通过高效的索引进行查询和检索，这使得web应用程序可以脱离网络运行。
浏览器的开发人员工具IndexedDB界面
不同的浏览器对于IndexedDB有不同的实现，正常来说，我们可以使用window.indexedDB来获取到浏览器的indexedDB对象。但是对于某些浏览器来说，还没有使用标准的window.indexedDB，而是用带前缀的实现。
// In the following line, you should include the prefixes of implementations you want to test.
window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
// DON'T use "var indexedDB = ..." if you're not in a function.
// Moreover, you may need references to some window.IDB* objects:
window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction || {READ_WRITE: "readwrite"};
// This line should only be needed if it is needed to support the object's constants for older browsers
window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;
// (Mozilla has never prefixed these objects, so we don't need window.mozIDB*)| 特性 | cookie | localStorage | sessionStorage | indexDB |
|---|---|---|---|---|
| 大小 | 4k左右 | 5M左右 | 5M左右 | 无限 |
| 存在时间 | 可以设置过期时间 | 一直存储，除非手动清理 | 关闭页面就清除 | 一直存在，除非手动清理 |
推荐使用indexedDB。IndexedDB是HTML5标准操作客户端数据库。indexedDB和web SQL都是客户端存储数据库，微信web SQL在主流浏览器中个别浏览器不支持，曾被W3C推荐标准，现已被废弃。
键值对储存：IndexedDB 内部采用对象仓库（object store）存放数据。所有类型的数据都可以直接存入，包括 JavaScript 对象。对象仓库中，数据以"键值对"的形式保存，每一个数据记录都有对应的主键，主键是独一无二的，不能有重复，否则会抛出一个错误。
异步：IndexedDB 操作时不会锁死浏览器，用户依然可以进行其他操作，这与 LocalStorage 形成对比，后者的操作是同步的。异步设计是为了防止大量数据的读写，拖慢网页的表现。
支持事务：IndexedDB 支持事务（transaction），这意味着一系列操作步骤之中，只要有一步失败，整个事务就都取消，数据库回滚到事务发生之前的状态，不存在只改写一部分数据的情况。
同源限制： IndexedDB 受到同源限制，每一个数据库对应创建它的域名。网页只能访问自身域名下的数据库，而不能访问跨域的数据库。
储存空间大：IndexedDB 的储存空间比 LocalStorage 大得多，一般来说不少于 250MB，甚至没有上限。
支持二进制储存：IndexedDB 不仅可以储存字符串，还可以储存二进制数据（ArrayBuffer 对象和 Blob 对象）。
在 IndexedDB 中，我们可以创建多个数据库，一个数据库中创建多张表，一张表中存储多条数据——这足以 hold 住复杂的结构性数据。
文章草稿自动保存，可以每改变一次就自动保存文章草稿到indexedDB，不用每次都连接数据库
不需要网络连接的离线纯应用，比如Todolist这类用来记录待办任务类型的应用。
需要存储大量数据的应用，比如图书馆管理系统这类存储大量数据的应用；
配合service work构建pwa应用，用于缓存网络请求。
即时聊天工具，大量消息需要存在本地。
一般来说，数据存储的的类型主要有以下两种：
持久化存储：这种数据是希望长久保留的，只有的当用户选择清除才会被删除掉（比如，在 Firefox 中，您可以通过转到*“首选项”*并使用“ *隐私和安全”>“Cookie 和站点数据”*下的选项，选择删除所有存储的数据或仅删除所选来源的存储数据）。
临时存储：临时型数据有一个全局限制和同源限制。全局限制是指临时性数据的总量不能超过磁盘总量的50%。当超出的时候，浏览器会自动删除最久远被用到的数据，直到可以储存目前需要储存的数据。同源限制是指同源下的临时型数据总量有一个限制，这个限制是全局限制的20%，但不低于10M，且不超过2G。当超出同源限制的时候，浏览器会抛出一个错误。（LRU 策略）。
在 Firefox 中，当使用持久存储时，会向用户提供一个 UI 弹出窗口，提醒他们这些数据将持续存在，并询问他们是否对此感到满意。临时数据存储不会引发任何用户提示。
默认的是临时存储；开发人员可以选择使用StorageManager.persist()方法使用持久储存。
索引的意义在于，可以让你搜索任意字段，也就是说从任意字段拿到数据记录。如果不建立索引，默认只能搜索主键(即从主键取值)。
假定新建表格的时候，对name字段建立了索引。objectStore.createIndex('name', 'name', { unique: false });
可以通过浏览器的开发人员工具查看indexedDB使用情况，包含indexedDB已使用空间和存储空间配额大小、删除indexedDB所有数据。
还可以通过过工具查询数据库、表、表字段、字段值，也可刷新删除。
