前言【本文首发于唐霜的博客】

本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。

indexedDB 是 html5 标准转载请注明出处：www.tangshuang.net【本文受版权保护】引入的web数据持久化方案之一，现代浏览转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】器大多按照标准对其进行了实现，我在新的项本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。目中用到它来作为持久化数据存储，于是详细【转载请注明来源】【本文受版权保护】研究了一番，MDN 上的解释虽然权威，但【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】是由于知识不成体系，细节也讲的不透，所以【版权所有，侵权必究】转载请注明出处：www.tangshuang.net我打算自己写一篇教程，对 indexed本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.netDB 的各个细节进行详解。

【作者：唐霜】【未经授权禁止转载】未经授权，禁止复制转载。未经授权，禁止复制转载。

为了和读者更贴近，我做了上面这套【作者：唐霜】视频教程原创内容，盗版必究。，总共7个课时，每天一小时，7天可学完。著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】虽然本文的内容已经覆盖了所有与 inde未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.netxedDB 相关的内容，但是视频教程的方【作者：唐霜】【未经授权禁止转载】式更轻松，而且其中有关概念的部分讲解的更【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。详细。掌握一门技术，不需要很长时间，7天著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。就可以。视频教程是付费教程，价格不贵，写【转载请注明来源】本文版权归作者所有，未经授权不得转载。教程真的不容易，希望大家多支持。

【未经授权禁止转载】【原创不易，请尊重版权】【版权所有，侵权必究】转载请注明出处：www.tangshuang.net【版权所有，侵权必究】

架构体系【关注微信公众号：wwwtangshuangnet】

【版权所有，侵权必究】转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。

这里说的结构体系，是指在 indexed【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。DB 中，几个重要的概念之间的关系。这些【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net概念包括：

未经授权，禁止复制转载。【未经授权禁止转载】未经授权，禁止复制转载。【原创不易，请尊重版权】【版权所有，侵权必究】

• 数据库【本文受版权保护】
未经授权，禁止复制转载。【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。【本文受版权保护】
• objectStore【本文首发于唐霜的博客】
著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net
• key-value【关注微信公众号：wwwtangshuangnet】
原创内容，盗版必究。【本文受版权保护】本文版权归作者所有，未经授权不得转载。【转载请注明来源】

简单的说，indexedDB 是非关系型【版权所有，侵权必究】未经授权，禁止复制转载。数据库，数据组织不像 SQL 数据库一样原创内容，盗版必究。【关注微信公众号：wwwtangshuangnet】，有表和字段，indexedDB 里面没【原创内容，转载请注明出处】原创内容，盗版必究。有表和字段的概念，它的最小组织单位（un本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.netit）是 key-value。在 ind原创内容，盗版必究。【本文受版权保护】exedDB 里，一对 key-valu【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】e 就相当于 SQL 数据库里面的一条记【关注微信公众号：wwwtangshuangnet】【作者：唐霜】录，是数据的最终体现形式。我们通过下面的著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。图来阐述 indexedDB 和 SQL原创内容，盗版必究。【本文首发于唐霜的博客】 数据库结构体系的不同，以帮助理解。

【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。

【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】【原创内容，转载请注明出处】

关系型数据库和非关系型数据库本身有非常大本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】的差别，关系型数据库大致上架构是一致的，【原创内容，转载请注明出处】【版权所有，侵权必究】但是非关系型数据库的架构各式各样，很不统著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。一。就 SQL DB 和 indexed【版权所有，侵权必究】【原创内容，转载请注明出处】DB 而言：

【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net【作者：唐霜】

• 在最下面那一层，两者都有 databas【转载请注明来源】【原创内容，转载请注明出处】e 的概念，要存储数据，首先要创建一个数【本文首发于唐霜的博客】【原创不易，请尊重版权】据库。
著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】【本文受版权保护】本文版权归作者所有，未经授权不得转载。
• 往上一层，两者就有了区别，SQL DB 【原创内容，转载请注明出处】未经授权，禁止复制转载。有表的概念，而 indexedDB 对应原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】的是 objectStore。
【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。
• 再往上一层，差别更大，SQL DB 的记【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net录有字段的概念，而 indexedDB 转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。的记录直接是键值对。
著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】

indexedDB 中的 objectS【作者：唐霜】【作者：唐霜】tore 虽然和 SQL DB 中的 t【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。able 非常像，但是它们的存储形式却极【原创内容，转载请注明出处】【原创不易，请尊重版权】其不同。objectStore 比 ta【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。ble 简单的多。

【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】【本文受版权保护】【本文受版权保护】

同时，indexedDB 内置了事务系统本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】，所有读写操作都是在事务中完成。

转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。

数据库本文作者：唐霜，转载请注明出处。

【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net【转载请注明来源】

indexedDB 是一个完备模型的数据本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net库，有标准的数据库结构体系。它虽然不是一未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net个运行时服务，而是基于文件的即时存取数据原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。库，但是仍然可以用其他数据库的模型思维来转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。了解它。在 indexedDB 中，我们【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。可以创建多个数据库，每个数据库有自己独立著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。的空间。

【本文首发于唐霜的博客】【作者：唐霜】未经授权，禁止复制转载。

连接数据库著作权归作者所有，禁止商业用途转载。

未经授权，禁止复制转载。未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】

要在 indexedDB 中存储数据，要本文作者：唐霜，转载请注明出处。原创内容，盗版必究。进行两步操作，第一步连接到某个数据库，第【版权所有，侵权必究】【原创不易，请尊重版权】二步挑选某个 objectStore 进【本文受版权保护】【未经授权禁止转载】行数据操作。现在讲解连接到 indexe本文作者：唐霜，转载请注明出处。【转载请注明来源】dDB 数据库。在 window 对象上本文作者：唐霜，转载请注明出处。原创内容，盗版必究。有一个 indexedDB 对象，直接调【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】用 open 方法进行打开，如果该数据库【作者：唐霜】本文作者：唐霜，转载请注明出处。不存在，则创建一个新的数据打开：

原创内容，盗版必究。本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】

const request = window.indexedDB.open('mydb', 1)

open有两个参数：【访问 www.tangshuang.net 获取更多精彩内容】

著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】【本文首发于唐霜的博客】

• name：数据库名【本文受版权保护】
【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】【原创不易，请尊重版权】
• version：版本著作权归作者所有，禁止商业用途转载。
【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】【原创不易，请尊重版权】

数据库版本【本文首发于唐霜的博客】

转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】原创内容，盗版必究。【版权所有，侵权必究】

上面的version参数对于初学者而言不著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。是很好理解。如果你用过 docker 的【本文受版权保护】【未经授权禁止转载】话，知道有一个东西叫镜像（image），【本文受版权保护】【原创不易，请尊重版权】在镜像的基础上构建自己的容器，可以再创建【未经授权禁止转载】原创内容，盗版必究。一个新的镜像，那么这个新的镜像其实就包含转载请注明出处：www.tangshuang.net【作者：唐霜】了老的镜像。这里的 version 也类【本文受版权保护】未经授权，禁止复制转载。似，它表示当前的数据库结构的版本。ver原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】sion 必须是正整数，只能升不能将，只本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。有当需要进行数据库结构修改的时候，才需要【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。升级 version。

本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。【原创不易，请尊重版权】

例如，一开始，version 为 1，创【本文受版权保护】【作者：唐霜】建了一些 objectStore，当你需【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】要添加新的 objectStore 或者著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】修改某些 objectStore 的时候原创内容，盗版必究。【本文受版权保护】，就需要升级 version。一个数据库本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】只能在同一时间存在一个 version，【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net不能同时存在多个 version。当你的未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。 version 升级之后，你还用老的 【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】version 去连接数据库，并进行数据【转载请注明来源】本文作者：唐霜，转载请注明出处。操作时，会抛出错误。

原创内容，盗版必究。【作者：唐霜】【作者：唐霜】原创内容，盗版必究。【本文受版权保护】

补充：有同学留言想对这个问题进行深入探讨转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】。我这里说一下我的想法。从项目的开发上讲转载请注明出处：www.tangshuang.net【未经授权禁止转载】，我们只会在发布代码时去升级 versi转载请注明出处：www.tangshuang.net【版权所有，侵权必究】on，而不会在程序运行过程中通过程序去更【未经授权禁止转载】【作者：唐霜】改 version，因为一旦用户刷新页面转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。，这个 version 会变成代码中设置著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net的 version，这会造成错误。我们升【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。级 version，是为了对数据库结构进本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。行修改，触发 onupgradeneeded 方法。本文作者：唐霜，转载请注明出处。

原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】本文版权归作者所有，未经授权不得转载。

在MDN里面有这样一句话：转载请注明出处：www.tangshuang.netWhen you call open()【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。 with a greater vers【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。ion than the actual 著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】version of the datab【原创不易，请尊重版权】【本文受版权保护】ase, all other open 本文作者：唐霜，转载请注明出处。原创内容，盗版必究。databases must expli【本文首发于唐霜的博客】未经授权，禁止复制转载。citly acknowledge th未经授权，禁止复制转载。未经授权，禁止复制转载。e request before you【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net can start making ch著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.netanges to the databas【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】e (an onblocked even【作者：唐霜】著作权归作者所有，禁止商业用途转载。t is fired until the本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】y are closed or relo【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.netaded). 也就是说，1. 你要传入一个更大当版本【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】来触发 onupgradeneeded，原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。2. 在数据库处于 open 状态时，对著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。数据库对修改是被 block 住，直到它未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】被 close 或 reload 之后，【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。这些修改才会生效。

转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】【访问 www.tangshuang.net 获取更多精彩内容】

【本文受版权保护】本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。

现在你需要记住的是，在后面的代码操作中，未经授权，禁止复制转载。原创内容，盗版必究。你要时刻保证你使用对了 version，【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。它的使用场景只有两种：

【原创内容，转载请注明出处】【未经授权禁止转载】原创内容，盗版必究。

• 当你需要修改 objectStore 时
【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】未经授权，禁止复制转载。【转载请注明来源】
• 当你需要添加新的 objectStore【关注微信公众号：wwwtangshuangnet】【本文受版权保护】 时
【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。

从代码的层面来看，并非这两个事情发生才触【版权所有，侵权必究】【本文受版权保护】发了 version 的改变，恰恰相反，转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。如果你要修改或添加 objectStor【本文受版权保护】【转载请注明来源】e，你必须通过传递新的 version 【原创不易，请尊重版权】未经授权，禁止复制转载。参数到 open 方法中，触发 onupgradeneeded，在 on本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。upgradeneeded 的回调函数中转载请注明出处：www.tangshuang.net【作者：唐霜】才能实现目的。

本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】

获得 db 容器转载请注明出处：www.tangshuang.net

原创内容，盗版必究。【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net

怎么从上面的 open 方法之后，获得可【作者：唐霜】【未经授权禁止转载】以用来进行操作的数据库对象容器：

【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。

const request = window.indexedDB.open('mydb', 1)
request.onsuccess = e => {
  const db = e.target.result
}

这样就获得了db的容器，利用该容器，我们【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。就可以进行数据库的下一步操作。

【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。【转载请注明来源】【作者：唐霜】

这是一个异步的操作，你不能在上面代码之后未经授权，禁止复制转载。未经授权，禁止复制转载。直接使用 db 变量，而是要在 onsu【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】ccess 的函数体内继续写代码。而且 【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】indexedDB 的所有编程都是这样，【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net这会导致嵌套层层加深，因此，我们这篇文章【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】后面还会提供使用 Promise 进行封【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】装的类，使用该类你无需做复杂的操作。

原创内容，盗版必究。【原创内容，转载请注明出处】原创内容，盗版必究。【版权所有，侵权必究】

objectStore本文版权归作者所有，未经授权不得转载。

【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】转载请注明出处：www.tangshuang.net

objectStore 是 indexe【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。dDB 中非常核心的概念，它是数据的存储本文版权归作者所有，未经授权不得转载。【本文受版权保护】仓库，一个 objectStore 类似本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。于 SQL 数据库中的表，存放着相关的所【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。有数据记录。

【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】

什么是 objectStore？【访问 www.tangshuang.net 获取更多精彩内容】

【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。

indexedDB 是 key-valu【原创内容，转载请注明出处】【作者：唐霜】e 数据库，具体体现就是 objectS【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.nettore. objectStore 是 未经授权，禁止复制转载。【原创内容，转载请注明出处】indexedDB 的数据存储机制，和 原创内容，盗版必究。【本文受版权保护】SQL 的表的地位一致。每一条记录包含了【本文受版权保护】【作者：唐霜】 key 和 value。

【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】

本文作者：唐霜，转载请注明出处。【本文受版权保护】【原创不易，请尊重版权】

indexedDB 之所以将自己的存储机著作权归作者所有，禁止商业用途转载。【关注微信公众号：wwwtangshuangnet】制称为 objectStore，在 st【本文首发于唐霜的博客】【版权所有，侵权必究】ore 前面加上 object，是因为它本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】所存储的记录的集合，就像一个 objec【访问 www.tangshuang.net 获取更多精彩内容】【本文受版权保护】t 一样，是一个 key-value 的未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。集合。

本文作者：唐霜，转载请注明出处。原创内容，盗版必究。【未经授权禁止转载】

什么是 key？本文版权归作者所有，未经授权不得转载。

【本文受版权保护】本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】

key 是 value 的标记值。【版权所有，侵权必究】

【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】原创内容，盗版必究。

我们通过 key 得到 indexedD【原创内容，转载请注明出处】【未经授权禁止转载】B 中存储的对应值。要获得 value，原创内容，盗版必究。本文作者：唐霜，转载请注明出处。必须通过 key 来获得。key 和 v【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。alue 具有绑定关系，key 相当于 【作者：唐霜】本文作者：唐霜，转载请注明出处。value 的缩写、别名、标记。

【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。【作者：唐霜】【本文首发于唐霜的博客】【作者：唐霜】

但和 localStorage 不同，i未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】ndexedDB 的 key 有两种形态【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。：inline 和 outline。in【本文首发于唐霜的博客】【作者：唐霜】line key 是指 key 被包含在【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。 value 中，例如你存储的 valu原创内容，盗版必究。【版权所有，侵权必究】e 是对象时，就可以将 key 包含在 转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.netvalue 中。outline key 【版权所有】唐霜 www.tangshuang.net【本文受版权保护】则是不被包含在 value 中，例如你存【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】储的是字符串，或者 ArrayBuffe【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。r，就不可能在 value 中包含 ke本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。y，这种情况下通过开启 autoIncr【原创不易，请尊重版权】转载请注明出处：www.tangshuang.netement 来实现，下文会详细介绍。

【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。【本文受版权保护】【作者：唐霜】【关注微信公众号：wwwtangshuangnet】

【未经授权禁止转载】【本文首发于唐霜的博客】【作者：唐霜】本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net

上图中上面一条记录的 value 是一个【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。对象，key 来自对象的 id 属性值，未经授权，禁止复制转载。【未经授权禁止转载】这个 key 是 inline key。转载请注明出处：www.tangshuang.net【本文受版权保护】下面一条记录，value 是一个字符串，【关注微信公众号：wwwtangshuangnet】【原创不易，请尊重版权】key 是由系统自动生成，这个 key 【版权所有，侵权必究】转载请注明出处：www.tangshuang.net是 outline key。

著作权归作者所有，禁止商业用途转载。【本文受版权保护】【转载请注明来源】【转载请注明来源】著作权归作者所有，禁止商业用途转载。

例如有一个值是 【原创内容，转载请注明出处】{ body: { color: 'red' } } 而 keyPath 为 【访问 www.tangshuang.net 获取更多精彩内容】body.color，那么就可以得到 key 为 本文作者：唐霜，转载请注明出处。red。这可能和我们以前理解的地方有所不同。在【本文受版权保护】【本文首发于唐霜的博客】 IndexedDB 中，我们要通过 r本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。ed 去找到这个值。

【本文受版权保护】【本文受版权保护】【转载请注明来源】

什么是 keyPath？【转载请注明来源】

未经授权，禁止复制转载。【转载请注明来源】著作权归作者所有，禁止商业用途转载。【本文受版权保护】【版权所有】唐霜 www.tangshuang.net

keyPath 是指在对象中，获取一个节本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】点值的属性链式方法的字符串表达。例如：

未经授权，禁止复制转载。【本文受版权保护】原创内容，盗版必究。【本文受版权保护】

{
  books: [
    { name: 'My Uncle Tom', price: 13.4 }
  ],
}

其中我要获得第一本书的价格，那么它的 k本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。eyPath 就是 ‘boo未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。ks[0].price’。它【未经授权禁止转载】【未经授权禁止转载】是一个字符串，但可以用来表达获得一个节点转载请注明出处：www.tangshuang.net【本文受版权保护】值的属性路径。所以，keyPath 这个【作者：唐霜】本文作者：唐霜，转载请注明出处。单词中的 path 就是这个意思。

【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】

key 和 keyPath 的联系【版权所有】唐霜 www.tangshuang.net

【原创内容，转载请注明出处】【作者：唐霜】转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】

keyPath 的作用是读取 key。【访问 www.tangshuang.net 获取更多精彩内容】

【未经授权禁止转载】【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。【作者：唐霜】

key 是 value 的 keyPat【关注微信公众号：wwwtangshuangnet】【关注微信公众号：wwwtangshuangnet】h 的值。

未经授权，禁止复制转载。【本文受版权保护】原创内容，盗版必究。【版权所有，侵权必究】

【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。

这句话的意思是：1. value 是一个本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】对象，2. 以 keyPath 作为属性原创内容，盗版必究。【关注微信公众号：wwwtangshuangnet】路径从 value 中读取某个节点的值；【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。3. 这个值就是 key。当然，这里面有转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】一些前提条件，例如“value 是一个对【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】象”，不是字符串，“value 存在 k【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】eyPath，并能读取值”。

转载请注明出处：www.tangshuang.net【未经授权禁止转载】未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。

一般而言，keyPath 在创建 obj【版权所有，侵权必究】【版权所有，侵权必究】ectStore 和 index 的时候【版权所有，侵权必究】原创内容，盗版必究。就已经确定了，不会改。所以，在实际编程的【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。时候，我们很少会去用 keyPath，而【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net是拿到一个 key 进行操作。

【转载请注明来源】本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net

keyPath 的高级用法是，支持一个数著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。组作为 keyPath，但这个我们不深入著作权归作者所有，禁止商业用途转载。【作者：唐霜】探讨。如果 keyPath 是一个数组，【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】表示在查询的时候，只要其中之一可以查到值本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】，就返回得到的值。

【本文受版权保护】著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。原创内容，盗版必究。

对于 outline key 的情况，在【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】创建 objectStore 时，我们不未经授权，禁止复制转载。原创内容，盗版必究。能传 keyPath，并且开启 auto本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】Increment，indexedDB 【本文受版权保护】【关注微信公众号：wwwtangshuangnet】会默认以 ‘id’未经授权，禁止复制转载。【原创不易，请尊重版权】; 作为 keyPath，但我们不会用到【转载请注明来源】【转载请注明来源】这个 ‘id’。

【本文受版权保护】【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】

可以存储哪些数据类型？本文作者：唐霜，转载请注明出处。

原创内容，盗版必究。【转载请注明来源】原创内容，盗版必究。

根据 w3c 文档未经授权，禁止复制转载。描述【原创内容，转载请注明出处】，indexedDB 可以存储的数据类型未经授权，禁止复制转载。【作者：唐霜】为：

【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net

String, Date, Object【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】, Arra, File, 未经授权，禁止复制转载。Blob, 【原创内容，转载请注明出处】ImageData等等。另外，网上很多人指出，支持存储 A转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.netrrayBuffer。

【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】【原创不易，请尊重版权】原创内容，盗版必究。【版权所有，侵权必究】

根据 w3c 的描述，凡是能进行序列化的转载请注明出处：www.tangshuang.net【作者：唐霜】值，都可以被 indexedDB 存储。【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。也就是说，不能被序列化的，例如自引用的 【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。object，或者某些类的实例，还有 f【转载请注明来源】未经授权，禁止复制转载。unction，就不能被 indexed转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.netDB 存储。简单理解就是，不能存func本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.nettion等非结构化的数据，object必【作者：唐霜】原创内容，盗版必究。须是以键值对组成的字面对象。

著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。

创建 objectStore【作者：唐霜】

【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。

创建 objectStore 和修改 o原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。bjectStore 都只能在 db 的未经授权，禁止复制转载。【转载请注明来源】 onupgradeneeded 事件中进未经授权，禁止复制转载。原创内容，盗版必究。行，因此，要创建 objectStore原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】，必须在前面的 open 操作那个时候来本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net进行。

未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。

const request = window.indexedDB.open('mydb', 1)
request.onupgradeneeded = (e) => {
  const db = e.target.result
  db.createObjectStore('mystore', { keyPath: 'id' })
}
request.onsuccess = (e) => {
  const db = e.target.result
  // ...
}

上面的红色代码中，我们使用 create未经授权，禁止复制转载。【原创不易，请尊重版权】ObjectStore 方法来实现 ob本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。jectStore 的创建。但是，需要注【关注微信公众号：wwwtangshuangnet】【转载请注明来源】意的是，一个 database 中，只允【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net许存在一个同名的 objectStore【版权所有，侵权必究】【原创内容，转载请注明出处】，因此，如果你第二次 createObj原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。ectStore 相同名的objectS转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。tore，程序会报错。比如你的程序如果像著作权归作者所有，禁止商业用途转载。【转载请注明来源】上面这样写，必然会遇到一个问题，就是当你转载请注明出处：www.tangshuang.net【作者：唐霜】更新 version 的时候，会再次执行【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】 createObjectStore，那【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】么就会报错，程序就会中断。另一个注意点是【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】，一旦一个 objectStore 被创【原创不易，请尊重版权】未经授权，禁止复制转载。建，它的 name 和 keyPath 【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。是不能修改的。那么有什么办法来控制呢？通【本文受版权保护】本文作者：唐霜，转载请注明出处。过一个判断，判断是否已经存在同名的 ob【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】jectStore 即可。

转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】

const request = window.indexedDB.open('mydb', 1)
request.onupgradeneeded = (e) => {
  const db = e.target.result
  if (!db.objectStoreNames.contains('mystore')) {
    db.createObjectStore('mystore', { keyPath: 'id' })
  }
}
request.onsuccess = (e) => {
  const db = e.target.result
  // ...
}

onupgradeneeded 不会在每【版权所有，侵权必究】【访问 www.tangshuang.net 获取更多精彩内容】次刷新页面的时候执行，而是在刷新页面时，【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】indexedDB 发现 version本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。 被升级了的时候执行。因此，所有的数据库本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。结构的东西，都要放在这个函数内去做。

【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】【作者：唐霜】本文版权归作者所有，未经授权不得转载。

objectStore 创建之后不可修改未经授权，禁止复制转载。原创内容，盗版必究。，如果创建时失误，给了错误的配置，必须先【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net删除该 objectStore 之后，重【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】新创建。

【原创不易，请尊重版权】【原创内容，转载请注明出处】【原创不易，请尊重版权】【未经授权禁止转载】

objectStore 的类型【原创不易，请尊重版权】

【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net

在编程上，不需要去分 objectSto原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。re 的类型。但是，在我们实际存储数据的【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】时候，我们自己需要去区分，因为不同类型的【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。 objectStore 用法不同。

【转载请注明来源】本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。

对象型仓库【未经授权禁止转载】

【本文首发于唐霜的博客】原创内容，盗版必究。本文作者：唐霜，转载请注明出处。

如果一个 objectStore 是用来未经授权，禁止复制转载。【作者：唐霜】存对象的，那么这种情况下你应该每次都存入原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】一个对象，而且，这个对象有一个属性路径是【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net规定的 keyPath。倘若这个对象不存原创内容，盗版必究。【作者：唐霜】在对应的 keyPath，那么就会报错。

著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】原创内容，盗版必究。

这里的对象不包括数组。【原创不易，请尊重版权】

【未经授权禁止转载】【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】

db.createObjectStore('mystore', { keyPath: 'id' })

非对象型仓库未经授权，禁止复制转载。

【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。原创内容，盗版必究。【本文受版权保护】【本文首发于唐霜的博客】

如果一个 objectStore 是用来【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net存非对象的，例如我们经常会考虑用来存 A本文版权归作者所有，未经授权不得转载。【作者：唐霜】rrayBuffer，这个时候，你应该在转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】创建 objectStore 的时候，传【转载请注明来源】【关注微信公众号：wwwtangshuangnet】入配置信息 autoIncrement 本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。为 true，不传 keyPath。

【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】

db.createObjectStore('mystore', { autoIncrement: true })

这种情况下，存入数据（ArrayBuff【原创不易，请尊重版权】未经授权，禁止复制转载。er）时，key 会被自动添加上，且跟 未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。SQL 数据的自增字段一样，索引值会在原【关注微信公众号：wwwtangshuangnet】【关注微信公众号：wwwtangshuangnet】有基础上自加 1。在查询或更新值的时候，【转载请注明来源】转载请注明出处：www.tangshuang.net都要使用这个值作为 key。但是，这种情转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】况下，会有一个问题，key 是在运行时保本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】存在内存中的，一旦用户刷新页面，你就不知本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】道刚刚插入的值的 key 了。对于这种情【未经授权禁止转载】未经授权，禁止复制转载。况，如果想持久化，可以和 localSt【版权所有】唐霜 www.tangshuang.net【转载请注明来源】orage 一起使用来解决。

【版权所有，侵权必究】【转载请注明来源】【原创内容，转载请注明出处】

混合仓库未经授权，禁止复制转载。

【版权所有，侵权必究】【版权所有，侵权必究】【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net

如果你硬是要在一个 objectStor原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。e 中混合存值，那么必须按照非对象型仓库【作者：唐霜】【未经授权禁止转载】来使用。但是会有一个不一样的地方，当你存【原创不易，请尊重版权】【版权所有，侵权必究】入一个对象时，如果该对象中并没有对应的 未经授权，禁止复制转载。【原创不易，请尊重版权】keyPath，那么，它会在存入时被自动著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net加上这个 keyPath。这一点非常奇怪【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。，你会发现，存入 string, Blo著作权归作者所有，禁止商业用途转载。【本文受版权保护】b 和存入 object 的效果竟然不同【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】。

【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。

db.createObjectStore('mystore', { keyPath: 'id', autoIncrement: true })

当你插入的对象中不存在 id 属性时，对【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。象会被污染，会自动加上 id 属性，并且本文作者：唐霜，转载请注明出处。【作者：唐霜】赋予一个数字作为 key。

【原创内容，转载请注明出处】【作者：唐霜】【原创不易，请尊重版权】【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。

什么是 autoIncrement？【未经授权禁止转载】

【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。【转载请注明来源】【本文首发于唐霜的博客】

前面提到过 autoIncrement，【原创内容，转载请注明出处】【转载请注明来源】但是没有详细解释。这需要涉及到一个叫 key generator未经授权，禁止复制转载。 的东西，但是它过于底层，我们这里不深入【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net讲解，你可以自行了解，我们这里做简化说明著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。。autoIncrement 是一个配置著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】。当创建 objectStore 时，如著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】果 autoIncrement 被设置为著作权归作者所有，禁止商业用途转载。【本文受版权保护】 true，那么它的 key 将具备自动本文作者：唐霜，转载请注明出处。【本文受版权保护】生成的能力。

【原创不易，请尊重版权】【作者：唐霜】未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。

什么是自动生成？【关注微信公众号：wwwtangshuangnet】

本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net【本文受版权保护】

• 当存入的值不存在对应的 keyPath 【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net时，自动创建 keyPath，并用一个自【原创内容，转载请注明出处】原创内容，盗版必究。动生成的数字作为 key，这个动作被成为本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net“污染”
原创内容，盗版必究。【本文受版权保护】未经授权，禁止复制转载。【本文受版权保护】
• 自动生成的数字从 1 开始自增长，每次加未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。 1
【原创不易，请尊重版权】【本文受版权保护】著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net
• 当用户手动传入 key 时，如果是一个数【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】字，自增长的值会被覆盖，下次插入时，会从原创内容，盗版必究。【未经授权禁止转载】新的值开始计算
【本文受版权保护】本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。
• 如果手动传入的 key 不是数字，那么不【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。影响 key 的自增长，下次插入仍然以之【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。前的值作为基底
本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】
• 它的最大取值范围为 2未经授权，禁止复制转载。^{53【版权所有】唐霜 www.tangshuang.net}，超出时，继续享受自增长会报错，但可以通原创内容，盗版必究。【转载请注明来源】过自己给明确的字符串 key 继续添加记【原创不易，请尊重版权】未经授权，禁止复制转载。录
【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net原创内容，盗版必究。转载请注明出处：www.tangshuang.net【本文受版权保护】
• 在一条记录被插入时，add 或 put 本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】方法会返回该记录的 key
【转载请注明来源】【转载请注明来源】【未经授权禁止转载】【未经授权禁止转载】转载请注明出处：www.tangshuang.net
• 对于非对象的存入值，不会产生污染效果【作者：唐霜】
【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net【转载请注明来源】【版权所有】唐霜 www.tangshuang.net

对于对象型仓库，如果新增的值不存在对应的转载请注明出处：www.tangshuang.net【版权所有，侵权必究】 key，那么被存的值会被“污染”。标准【作者：唐霜】【版权所有，侵权必究】文档中是这么说的：“Then the v著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】alue provided by the【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】 key generator is us原创内容，盗版必究。本文作者：唐霜，转载请注明出处。ed to populate the k【本文首发于唐霜的博客】【版权所有，侵权必究】ey value.”也就是说，你在取出这【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。个值的时候，这个 key 被添加到了值上【本文首发于唐霜的博客】【作者：唐霜】，也就是说，存入的值被改了（添加了属性）【作者：唐霜】【转载请注明来源】。

本文版权归作者所有，未经授权不得转载。【本文受版权保护】【作者：唐霜】著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。

对于我们开发者而言，一般的建议是，如果你本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net的 objectStore 用于存储对象【原创不易，请尊重版权】【版权所有，侵权必究】，尽量不要开启 autoIncremen转载请注明出处：www.tangshuang.net【版权所有，侵权必究】t 功能。只有在储存非对象值时，一定要开【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net启 autoIncrement 功能。不【作者：唐霜】转载请注明出处：www.tangshuang.net建议使用混合型仓库。

【转载请注明来源】著作权归作者所有，禁止商业用途转载。【作者：唐霜】

index转载请注明出处：www.tangshuang.net

【转载请注明来源】【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】

索引是 indexedDB 中最值得玩味原创内容，盗版必究。本文作者：唐霜，转载请注明出处。的部分，这也是它取名“indexedDB【作者：唐霜】本文版权归作者所有，未经授权不得转载。”的原因。索引，是一系列概念的统称：

【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】

• 用于存储索引的空间被称为“索引”，例如我【版权所有】唐霜 www.tangshuang.net【转载请注明来源】们可以称 objectStore 的一个【版权所有】唐霜 www.tangshuang.net【转载请注明来源】索引
本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net
• 某条记录的索引也被称为“索引”，例如我们未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】可以称 value 的 indexNam本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】e 索引
【转载请注明来源】本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。

简单的说，索引是独立于 objectSt本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。ore 之外，但又和 objectSto【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】re 绑定的，用于建立更多查询线索的工具未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net。

【关注微信公众号：wwwtangshuangnet】【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。

什么是 index？【未经授权禁止转载】

【本文受版权保护】本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】

本质上，一个 index 是一个特殊的 转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.netobjectStore，它的存储结构和 【未经授权禁止转载】原创内容，盗版必究。objectStore 基本一致，也有自本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】己的 name（本文标记为 indexN原创内容，盗版必究。【原创内容，转载请注明出处】ame）, keyPath, key 和本文作者：唐霜，转载请注明出处。【作者：唐霜】 value。特殊之处在于，索引的 ke【原创内容，转载请注明出处】【本文受版权保护】y 具有一定的逻辑约束，例如 uniqu转载请注明出处：www.tangshuang.net原创内容，盗版必究。e 用于规定该 key 是唯一的。

【未经授权禁止转载】【作者：唐霜】未经授权，禁止复制转载。未经授权，禁止复制转载。【未经授权禁止转载】

【转载请注明来源】【本文受版权保护】转载请注明出处：www.tangshuang.net

上图是一个 index 存储器的示意图，【原创不易，请尊重版权】【转载请注明来源】一个 objectStore 可以有多个本文作者：唐霜，转载请注明出处。【未经授权禁止转载】 index 和自己绑定。

【版权所有，侵权必究】【版权所有，侵权必究】转载请注明出处：www.tangshuang.net【转载请注明来源】【本文首发于唐霜的博客】

index 和 objectStore 本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。的关系

【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】

index 依附于 objectStor【作者：唐霜】本文作者：唐霜，转载请注明出处。e。我们在创建索引时，首先要得到一个 o【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.netbjectStore，再在这个 obje【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】ctStore 的基础上创建一个索引。一原创内容，盗版必究。未经授权，禁止复制转载。个 objectStore 可以有多个索【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】引。

【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。

index 的 key 和 value 【版权所有，侵权必究】未经授权，禁止复制转载。全部来自 objectStore。key【版权所有】唐霜 www.tangshuang.net【作者：唐霜】 为某条记录的 keyPath（inde【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】x.keyPath）的值，value 为原创内容，盗版必究。【本文受版权保护】这条记录的 key（objectStor【原创内容，转载请注明出处】【作者：唐霜】e.key）。index 中的一条记录自【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。动和 objectStore 中的对应记未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】录绑定，当 objectStore 中的【本文受版权保护】【作者：唐霜】记录发生变化时，index 中的记录会自【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。动被污染（自动更新）。

【原创不易，请尊重版权】【原创内容，转载请注明出处】原创内容，盗版必究。

本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】原创内容，盗版必究。【未经授权禁止转载】

index 实际上是对 objectSt转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。ore 查询条件的补充。如果没有 ind【未经授权禁止转载】【作者：唐霜】ex，我们只能通过 objectStor【原创不易，请尊重版权】【未经授权禁止转载】e 的 key 来查值，但是有了 ind【转载请注明来源】本文作者：唐霜，转载请注明出处。ex，我们可以查询的能力被扩展到了任意属【本文受版权保护】著作权归作者所有，禁止商业用途转载。性路径。

【版权所有，侵权必究】【作者：唐霜】【本文首发于唐霜的博客】【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】

和 objectStore 不同，ind本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】ex 的同一个 key 可以存在多个，因原创内容，盗版必究。转载请注明出处：www.tangshuang.net为不同的存入值的某个 keyPath 可【关注微信公众号：wwwtangshuangnet】【作者：唐霜】能存在相同的值。

【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net

如何创建索引？转载请注明出处：www.tangshuang.net

【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】【转载请注明来源】

创建索引这个动作，实际上是对 objec【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。tStore 进行修改，因此，只能在 d转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。b 的 onupgradeneeded 事件中处【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。理。

【本文首发于唐霜的博客】【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】【本文受版权保护】

let request = window.indexedDB.open('mydb', 1)
request.onupgradeneeded = e => {
  let db = e.target.result
  let objectStore = db.createObjectStore('mystore', { keyPath: 'id' }) //注意这里应该进行判断是否已经存在这个 objectStore，我是为了省事
  objectStore.createIndex('price', 'book.price', { unique: false })
}

objectStore 对象有一个 cr【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】eateIndex 方法，它可以创建索引【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】。它有三个参数，第一个参数是这个索引的 【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】indexName，第二个参数是 key未经授权，禁止复制转载。转载请注明出处：www.tangshuang.netPath，第三个参数是 options，【未经授权禁止转载】【原创内容，转载请注明出处】其中 unique 选项被放在这里面。

本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】【作者：唐霜】【关注微信公众号：wwwtangshuangnet】

如何修改索引？【原创内容，转载请注明出处】

著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。

虽然 objectStore 本身的信息本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】是不能修改的，比如 name 和 key未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。Path 都是不能修改的，但是它所拥有的原创内容，盗版必究。本文作者：唐霜，转载请注明出处。索引可以被修改，修改其实就是删除+添加操【作者：唐霜】【版权所有，侵权必究】作。用到的就是 deleteIndex 转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。这个方法，所以，如果你想修改一个索引，要【本文首发于唐霜的博客】原创内容，盗版必究。做的就是先删除掉原来的同名索引，然后添加【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】新的索引。举个例子，如果你知道数据库中已本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】经存在 mystore 这个 objec未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。tStore 了：

著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。【作者：唐霜】未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。

request.onupgradeneeded = (e) => {
  const objectStore = e.target.transaction.objectStore('mystore')
  const indexNames = objectStore.indexNames
  if (indexNames.contains('name')) {
    objectStore.deleteIndex('name')
  }
  objectStore.createIndex('name', 'name', { unique: false })
}

上面这段代码通过对已有的 objectS【版权所有，侵权必究】原创内容，盗版必究。tore 的 index 进行操作，如果【转载请注明来源】【版权所有，侵权必究】存在某个 index 时，就删除它再添加【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net，如果没有就直接添加。

【原创不易，请尊重版权】【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】

索引的运行机制【关注微信公众号：wwwtangshuangnet】

转载请注明出处：www.tangshuang.net【转载请注明来源】原创内容，盗版必究。【原创不易，请尊重版权】

indexName 是对一个索引的命名，转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】这个名字会被用在按索引检索中，它本身和使【本文受版权保护】【关注微信公众号：wwwtangshuangnet】用被存储数据的那个属性路径没关系，但你可【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】以把它当做是一个别名。

【转载请注明来源】【版权所有】唐霜 www.tangshuang.net【转载请注明来源】转载请注明出处：www.tangshuang.net

例如，你在创建索引的时候，是这样创建的：

本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。【本文受版权保护】

objectStore.createIndex('indexName', 'index.keyPath', { unique: false })

在根据索引进行查询的时候，语法是这样的：

原创内容，盗版必究。【未经授权禁止转载】原创内容，盗版必究。

const request = objectStore.index('indexName').get('indexKey')

这实际上是两个过程，第一个过程是在保存数转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】据时（包括创建和更新），索引区会同步更新【作者：唐霜】著作权归作者所有，禁止商业用途转载。自己的 key，它包含如下步骤：

【版权所有，侵权必究】转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。

• 遍历该 objectStore 的所有索【转载请注明来源】【作者：唐霜】引
【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】
• 读取索引的 keyPath，我们这里标记【转载请注明来源】【版权所有】唐霜 www.tangshuang.net为 indexKeyPath
著作权归作者所有，禁止商业用途转载。【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。
• 如果是更新某个值，遍历索引区记录，找到引本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。用该值的索引记录^{[1]著作权归作者所有，禁止商业用途转载。}
【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。
• 解析得到被存入的值的 indexKeyP【作者：唐霜】本文版权归作者所有，未经授权不得转载。ath，得到目标值，这个值即索引将要使用【未经授权禁止转载】【本文受版权保护】的 key，我们标记为 indexKey
转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。
• 索引 indexKey 的条件判断，例如【本文受版权保护】【作者：唐霜】，检查是否满足 unique 要求，不满原创内容，盗版必究。本文作者：唐霜，转载请注明出处。足的情况下，抛出错误提示
本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。本文作者：唐霜，转载请注明出处。
• 更新索引记录的 key 为 indexK本文作者：唐霜，转载请注明出处。【作者：唐霜】ey
【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】未经授权，禁止复制转载。未经授权，禁止复制转载。【版权所有，侵权必究】

第二个过程是查询过程，【版权所有】唐霜 www.tangshuang.net.index('indexName') 这个动作就是从名字为 indexNam未经授权，禁止复制转载。【原创不易，请尊重版权】e 的索引区去进行索引查询，.get('indexKey') 这个动作包含了好几步：【版权所有，侵权必究】

【作者：唐霜】转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net

• 连接到名字为 ‘indexN未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。ame’ 的索引区
本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net
• 在索引区中查询索引 key 为 R【本文受版权保护】【转载请注明来源】16;indexKey’ 的原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。索引记录
转载请注明出处：www.tangshuang.net【转载请注明来源】【本文受版权保护】著作权归作者所有，禁止商业用途转载。
• 得到该记录后，读取记录的 value【未经授权禁止转载】
【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】
• 将该 value 作为 objectSt原创内容，盗版必究。未经授权，禁止复制转载。ore 的 key 到 objectSt【作者：唐霜】【访问 www.tangshuang.net 获取更多精彩内容】ore 中进行查询
转载请注明出处：www.tangshuang.net【版权所有，侵权必究】转载请注明出处：www.tangshuang.net
• 找到第一个结果时，直接返回【未经授权禁止转载】
【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。
• 将放回的结果作为索引查询的最终结果转载请注明出处：www.tangshuang.net
【版权所有，侵权必究】【本文受版权保护】【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net

从某种意义上讲，索引查询的性能肯定不如直【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】接通过 objectStore 的 ke【未经授权禁止转载】【本文受版权保护】y 查询。

未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。

^{[1]【原创不易，请尊重版权】} 在索引中，存在一个叫 【访问 www.tangshuang.net 获取更多精彩内容】referenced value转载请注明出处：www.tangshuang.net 的东西，即一个索引建立的时候，会自动引本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】用 objectStore 中对应的记录【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】。所以，对于开发者，不用担心索引是如何去【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。快速找到它在 objectStore 的【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】对应记录的。

【转载请注明来源】转载请注明出处：www.tangshuang.net【本文受版权保护】

什么是 unique？【作者：唐霜】

本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。【原创不易，请尊重版权】

默认情况下，index 的 key 是可未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】以重复的。所有的值被存在 objectS本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】tore 中，但是所有值除了 objec【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】tStore 中规定的 keyPath 【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net必须唯一之外，默认情况下，其他属性可以相未经授权，禁止复制转载。【作者：唐霜】同。但是，如果你建立的索引传入了 uni【原创不易，请尊重版权】【原创不易，请尊重版权】que 参数，那么情况就会发生变化。也就【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net是说，该索引的 keyPath 被用于检未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。查存入的值对应的 keyPath 是否已著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】经有值，如果 objectStore 中转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】存在该 keyPath 的值为将要存入的本文版权归作者所有，未经授权不得转载。【作者：唐霜】值的该 keyPath 值，那么会抛出错【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。误。

【版权所有，侵权必究】原创内容，盗版必究。【转载请注明来源】【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。

transaction【版权所有，侵权必究】

【转载请注明来源】著作权归作者所有，禁止商业用途转载。【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】

所有结构完备的数据库中都有“事务”这个概原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.net念，它是为了确保当并非执行某些操作时，不【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。致混乱。举个简单的例子，当你在像好友打钱【原创不易，请尊重版权】【本文首发于唐霜的博客】的时候，发起了一个请求，这个请求发起后，【本文首发于唐霜的博客】【转载请注明来源】就建立了你打钱的事务，后面一大堆数据库写【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。入的操作，但是，假如中间突然机房停电，银【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。行系统发生故障，你又发起了第二个打钱的请【未经授权禁止转载】【原创不易，请尊重版权】求，那么会不会有这样一种可能，你第一次打转载请注明出处：www.tangshuang.net【版权所有，侵权必究】出去的钱你朋友根本没收到？数据库系统为了【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。避免这种情况，采用事务机制，如果出错，那【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。就回滚，把你打出去但对方没收到的钱回到你转载请注明出处：www.tangshuang.net【未经授权禁止转载】账上，重新再执行一次打钱的操作，执行完这本文作者：唐霜，转载请注明出处。原创内容，盗版必究。个操作之后，再执行你第二次打钱的操作。这【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】样就保证了数据库增删改有序不混乱。

【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】

什么是 transaction？【版权所有】唐霜 www.tangshuang.net

转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net

indexedDB 里面的事务，保证了所【未经授权禁止转载】【作者：唐霜】有操作（特别是写入操作）是按照一定的顺序本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】进行，不会导致同时写入的问题。另外，in原创内容，盗版必究。【版权所有，侵权必究】dexedDB 里面，强制规定了，任何读【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。写操作，都必须在一个事务中进行。从前面的本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】代码里面你也看到了，对 objectSt【作者：唐霜】本文版权归作者所有，未经授权不得转载。ore 的修改，其实也是在一个事务中进行【作者：唐霜】【未经授权禁止转载】。

【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。【版权所有，侵权必究】【原创不易，请尊重版权】

特别是写操作，事务通过尝试性写入完成第一著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。步更新，如果整个尝试过程没有出错，那么会【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。通过一个 commit 操作使得整个更新著作权归作者所有，禁止商业用途转载。【本文受版权保护】生效。但是如果在尝试过程中出错了，就会进原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。行一个 abort 操作，之前做过的尝试原创内容，盗版必究。转载请注明出处：www.tangshuang.net会直接被丢弃，数据不会发生改变。一个 o著作权归作者所有，禁止商业用途转载。【作者：唐霜】bjectStore 的写入过程中，另外【本文受版权保护】【作者：唐霜】一个写入操作会被挂起，直到上一个事务完成本文版权归作者所有，未经授权不得转载。【作者：唐霜】。

著作权归作者所有，禁止商业用途转载。【作者：唐霜】本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。

如何使用 transaction？本文版权归作者所有，未经授权不得转载。

【版权所有，侵权必究】【本文受版权保护】未经授权，禁止复制转载。

在代码层面，我们必须通过 transac【原创内容，转载请注明出处】【本文首发于唐霜的博客】tion 方法，向数据库容器提出事务要求【本文受版权保护】【本文受版权保护】，才能往具体的 objectStore 【未经授权禁止转载】【未经授权禁止转载】进行数据处理：

原创内容，盗版必究。转载请注明出处：www.tangshuang.net【版权所有，侵权必究】未经授权，禁止复制转载。原创内容，盗版必究。

let transaction = db.transaction(['myObjectStore'], 'readonly')
let objectStore = transaction.objectStore('myObjectStore')
let request = objectStore.get('111')

上面这段代码的操作，我们得到了具体要进行【作者：唐霜】【原创内容，转载请注明出处】操作的 objectStore，这和我们【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】预期直接通过 db.objectStore('myObjectStore') 这样简洁的方法完全不同，indexed【转载请注明来源】【未经授权禁止转载】DB 中不能这么直接去获取 object【本文首发于唐霜的博客】【未经授权禁止转载】Store，而必须通过 transact【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。ion。

【本文首发于唐霜的博客】【本文受版权保护】本文作者：唐霜，转载请注明出处。

transaction 方法有两个参数：

本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】【转载请注明来源】

• objectStores：事务打算对哪些本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net objectStore 进行操作，因此【版权所有，侵权必究】【原创不易，请尊重版权】是一个数组
【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。
• mode：对进行操作的 objectSt【作者：唐霜】【本文首发于唐霜的博客】ore 的模式，即读写权限控制， rea【版权所有】唐霜 www.tangshuang.net【转载请注明来源】donly | readwrite
【本文受版权保护】未经授权，禁止复制转载。【原创不易，请尊重版权】

而通过 transaction 的 ob【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。jectStore 方法可以获取想要操作【本文受版权保护】【原创不易，请尊重版权】的 objectStore，但是它的参数著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】必须存在于上面的 objectStore【原创内容，转载请注明出处】【原创不易，请尊重版权】s 数组中，毕竟你的这个事务已经规定了要【本文受版权保护】【版权所有，侵权必究】对哪些 objectStore 进行操作【原创内容，转载请注明出处】【未经授权禁止转载】。

转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。【转载请注明来源】【转载请注明来源】【版权所有】唐霜 www.tangshuang.net

因为 objectStore 是在事务中【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。获取，因此一个 objectStore 转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。实例，如果有一个 transaction未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。 属性的话，那么可以通过这个属性找出它的【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】事务的实例。在 indexedDB 中，【本文首发于唐霜的博客】原创内容，盗版必究。你只能在事务中得到一个 objectSt【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。ore 实例，如果通过 db 的话，最多【版权所有，侵权必究】原创内容，盗版必究。只能得到 objectStore 的名字未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。列表，要获得 objectStore 的【原创内容，转载请注明出处】【本文首发于唐霜的博客】实例，必须在 transaction 中【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。。

【本文受版权保护】著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。【本文受版权保护】

补充：由于js是单线程运行程序，所以对于【本文首发于唐霜的博客】【原创不易，请尊重版权】所有事务而言，也是有先后顺序的，只有当某【未经授权禁止转载】【作者：唐霜】些事务完成之后，才会进入后面当事务，因此【原创不易，请尊重版权】原创内容，盗版必究。即使一个 objectStore 存在于本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net多个事务中，它也会按照事务出现当先后顺序【原创不易，请尊重版权】【原创内容，转载请注明出处】被操作，而不是被不同当事务交叉操作。另外未经授权，禁止复制转载。【版权所有，侵权必究】，对一个 objectStore 的写入【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】操作的事务只允许存在一个，它会自动根据你著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】传入的 mode 值为 readwrit【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】e 时进行判断和报错。

【版权所有，侵权必究】【本文首发于唐霜的博客】【本文受版权保护】【关注微信公众号：wwwtangshuangnet】

【本文受版权保护】【未经授权禁止转载】【本文首发于唐霜的博客】

事务生命周期【访问 www.tangshuang.net 获取更多精彩内容】

【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。【本文受版权保护】

知道有事务的存在之后，本文版权归作者所有，未经授权不得转载。一定要注意 indexedDB 事务的生转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。命周期。一个事务，它会把你在它的生命周期里面规未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net定的操作全部执行，一旦执行完，周期结束，【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。那么事务就关闭了，你不能再利用这个事务的【转载请注明来源】【本文受版权保护】实例进行下一步操作。

【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。【转载请注明来源】【转载请注明来源】

举一个错误的例子：转载请注明出处：www.tangshuang.net

【作者：唐霜】本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。原创内容，盗版必究。

var tx
var objectStore
var request = indexedDB.open('name', 1)
requst.onsuccess = function(e) {
  var db = e.target.result
  tx = db.transaction(["MyOBJ"],"readwrite")
  objectStore = tx.objectStore("MyOBJ")
}
btn.onclick = function() {
  objectStore.add({}) // 这时会报错，因为生命周期已经结束了，你不能在这里使用 tx 或 objectStore
}

上面灰色的代码是一个错误的使用思路。写代【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】码的人想在全局某个地方创建了一个事务，并【本文受版权保护】【原创不易，请尊重版权】用一个变量保存起来，好在后续操作中使用。本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】但是，indexedDB 中，事务会在非【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】常短的时间里面循环检查自己，当发现自己内【原创不易，请尊重版权】未经授权，禁止复制转载。部已经没有任何任务要做的时候，就将自己关转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】闭。要深入了解这一点，你需要了解 jav【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】ascript 调用栈、事件循环的知识，【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】可能有点复杂。

原创内容，盗版必究。【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。

总之，你可以把 indexedDB 里面本文作者：唐霜，转载请注明出处。【未经授权禁止转载】的事件想象成时间非常短（1ms）的 de本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。bounce，如果在这个 1ms 里面，著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net没有新的任务要做，它就关闭了，不能再被使【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。用。所以，上面正确的代码应该是：

【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】

btn.onclick = function() {
  var request = indexedDB.open('name', 1)
  requst.onsuccess = function(e) {
    var db = e.target.result
    var tx = db.transaction(["MyOBJ"],"readwrite")
    var objectStore = tx.objectStore("MyOBJ")
    var request = objectStore.add({ ... })
  }
}

即在每一次发生 click 事件的时候去【未经授权禁止转载】原创内容，盗版必究。发起一个事务，再在这个事务中搞事情。

【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net

什么是 request？【访问 www.tangshuang.net 获取更多精彩内容】

【本文受版权保护】著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】

我们操作数据，一定是在事务中进行。一个事【未经授权禁止转载】转载请注明出处：www.tangshuang.net务，本质上是控制一个生命周期，用于保证数【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】据库读写的可用和安全。但是，真正涉及到如【作者：唐霜】【访问 www.tangshuang.net 获取更多精彩内容】何去存取数据，我们需要发起一个 requ转载请注明出处：www.tangshuang.net原创内容，盗版必究。est。一个事务过程中，可以有多个 re本文版权归作者所有，未经授权不得转载。【作者：唐霜】quest，request 一定存在与事【本文首发于唐霜的博客】【转载请注明来源】务中，因此它肯定会有一个 transac【本文首发于唐霜的博客】【本文首发于唐霜的博客】tion 属性来获取它所属于的那个事务的未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。容器。

【作者：唐霜】【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net

为什么要有 request 呢？你可以把【本文首发于唐霜的博客】【本文受版权保护】 transaction 当做一个队列，【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。在这个队列中，request 在进行排队【作者：唐霜】著作权归作者所有，禁止商业用途转载。，每一个 request 都只包含一个操【转载请注明来源】【原创内容，转载请注明出处】作，比如添加，修改，删除之类的。这些操作【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。不能马上进行，比如修改操作，如果你马上进本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】行，就会导致大家同时修改怎么办的问题，把未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。多个修改操作放在 request 中，这【原创内容，转载请注明出处】【原创不易，请尊重版权】些 request 在 transact【版权所有，侵权必究】【访问 www.tangshuang.net 获取更多精彩内容】ion 中排队，一个一个处理，这样就会有原创内容，盗版必究。【版权所有，侵权必究】执行的顺序，修改就有前后之分。同时，tr【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.netansaction 都可以被 abort【本文首发于唐霜的博客】未经授权，禁止复制转载。，这样当一系列的操作被放弃之后，后续的操【作者：唐霜】【访问 www.tangshuang.net 获取更多精彩内容】作也不会进行。

【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。【本文受版权保护】转载请注明出处：www.tangshuang.net【作者：唐霜】

而且非常重要的思想是，request 是转载请注明出处：www.tangshuang.net【转载请注明来源】异步的，它有状态，一个 request 【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。处于什么状态，可以通过 readyStates 属性查到，这对开发者而言也更可控。本文版权归作者所有，未经授权不得转载。

【版权所有】唐霜 www.tangshuang.net【作者：唐霜】转载请注明出处：www.tangshuang.net

目前，在 indexedDB 中，有四种转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】可能产生 request：open da【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】tabase，objectStore r【版权所有】唐霜 www.tangshuang.net【转载请注明来源】equest, cursor reque未经授权，禁止复制转载。【版权所有，侵权必究】st, index request。

【访问 www.tangshuang.net 获取更多精彩内容】【本文受版权保护】【本文受版权保护】

cursor【作者：唐霜】

转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】【原创不易，请尊重版权】

虽然 indexedDB 使用 obje【版权所有，侵权必究】未经授权，禁止复制转载。ctStore 存储数据，是一个 key【本文受版权保护】【本文受版权保护】-value 数据库。但是，我们有遍历所本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net有记录的需求。cursor 游标，就是 【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.netindexedDB 提供的遍历整个 ob【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】jectStore 的能力接口。

未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。【本文受版权保护】

什么是 cursor？【原创内容，转载请注明出处】

【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net

概念上讲，游标是“一个用来记录数组正在被【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。操作的某个下标位置的迭代器”。举个例子，【本文受版权保护】【作者：唐霜】你有一个数组 [1,2,3,4]，现在你原创内容，盗版必究。【转载请注明来源】要对它进行遍历，使用 forEach 方转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。法，那么 forEach 方法怎么知道你【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。上次操作到第几个元素，现在应该操作第几个【未经授权禁止转载】【转载请注明来源】元素呢？它通过内部的一个迭代器实现。游标【转载请注明来源】【关注微信公众号：wwwtangshuangnet】本质上是一个迭代器，也就意味着有类似于 【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。next 的方法，可以用来移动游标到下一【作者：唐霜】本文作者：唐霜，转载请注明出处。个位置，有 value 属性用来读取当前转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。值。当然，游标不能理解为纯粹的迭代器，因【作者：唐霜】未经授权，禁止复制转载。为它的内部过程需要进行 I/O 操作。

【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。【版权所有，侵权必究】【作者：唐霜】

获取全部 object本文作者：唐霜，转载请注明出处。

【本文首发于唐霜的博客】【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net

想要获取一个 objectStore 中【本文首发于唐霜的博客】【原创内容，转载请注明出处】的全部 object 可不是一件简单的事【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。。indexedDB 1.0 版本的时候【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。没有直接提供类似的方法来获取（2.0 已【未经授权禁止转载】未经授权，禁止复制转载。经提供了 getAll 方法）。那么我们本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。应该怎么办呢？利用游标。

【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】【原创内容，转载请注明出处】

let transaction = db.transaction(['myObjectStore'], 'readonly')
let objectStore = transaction.objectStore('myObjectStore')
let request = objectStore.openCursor()
let results = []
request.onsuccess = e => {
  let cursor = e.target.result
  if (cursor) {
    results.push(cursor.value)
    cursor.continue()
  }
  else {
    // 所有的object都在results里面
  }
}

通过 openCursor 方法开启一个【本文受版权保护】【本文首发于唐霜的博客】游标，在其 onsuccess 事件中，【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】如果 cursor 没有遍历完所记录，那【转载请注明来源】本文作者：唐霜，转载请注明出处。么通过执行 cursor.continu【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。e() 来让游标滑动到下一个记录，ons【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。ucess 会被再次触发。而如果所有记录本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】都遍历完了，cursor 变量会是 un【版权所有，侵权必究】原创内容，盗版必究。defined。

【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net

注意上面蓝色的 results，它的声明【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net必须放在 onsuccess 回调函数的本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。外部，因为该回调函数会在遍历过程中反复执本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。行。

【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】未经授权，禁止复制转载。【版权所有，侵权必究】

通过 index 查询集合本文版权归作者所有，未经授权不得转载。

【转载请注明来源】转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】

前文举例过如何通过 index 查询值。【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net但是，在前面的演示代码中，仍然只能得到一【作者：唐霜】【访问 www.tangshuang.net 获取更多精彩内容】个值，加入我们希望通过 index 得到【未经授权禁止转载】【原创不易，请尊重版权】某个 index key 的所有值呢？通【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。过游标就可以实现。

原创内容，盗版必究。原创内容，盗版必究。本文作者：唐霜，转载请注明出处。

let objectStore = db.transaction([storeName], 'readonly').objectStore(storeName)
let objectIndex = objectStore.index('name')
let request = objectIndex.openCursor()
request.onsuccess = e => {
  let cursor = e.target.result
  if (cursor) {
    results.push(cursor.value)
    cursor.continue()
  }
  else {
    // 所有的 object 都在 results 里面
  }
}

你可以发现，整个操作跟前面的获取所有 o未经授权，禁止复制转载。未经授权，禁止复制转载。bject 几乎一样，只不过这里先得到了【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net index。

【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net

你也可以总结出游标的使用，简单的说，就是未经授权，禁止复制转载。【作者：唐霜】对已知的集合对象（比如 objectSt【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】ore 或 index）进行遍历，在 o【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。nsuccess 中使用 continu本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。e 来进行控制。

【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】未经授权，禁止复制转载。

数据的存取【原创内容，转载请注明出处】

【原创内容，转载请注明出处】【未经授权禁止转载】【版权所有，侵权必究】

当一个事务开始之后，在它的生命周期以内，【原创内容，转载请注明出处】原创内容，盗版必究。你可以对 objectStore 进行数【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】据操作，数据操作无非是增删改查。前面介绍【本文受版权保护】转载请注明出处：www.tangshuang.net过如何获取事务中的objectStore【原创不易，请尊重版权】【原创不易，请尊重版权】，现在，我们就用获取到的objectSt著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.netore进行数据操作。

转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】【转载请注明来源】

获取数据【本文受版权保护】

本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】

let transaction = db.transaction(['myObjectStore'], 'readonly')
let objectStore = transaction.objectStore('myObjectStore')
let request = objectStore.get('100001')
request.onsuccess = e => {
  let obj = e.target.result
}

的确，在indexedDB事务机制下进行转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】操作是很麻烦的，上面代码中我们使用了ge【本文首发于唐霜的博客】【作者：唐霜】t方法获取主键值为100001的obje本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。ct，但是获取过程是一个Request，【作者：唐霜】【未经授权禁止转载】后文会详细讲Request是什么东东，只转载请注明出处：www.tangshuang.net【版权所有，侵权必究】有在其onsuccess事件中才能得到获【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。取到的结果。

【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net【转载请注明来源】未经授权，禁止复制转载。

添加数据著作权归作者所有，禁止商业用途转载。

【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。【转载请注明来源】【原创内容，转载请注明出处】

let transaction = db.transaction(['myObjectStore'], 'readonly')
let objectStore = transaction.objectStore('myObjectStore')
let request = objectStore.add({
  id: '100002',
  name: 'Zhang Fei',
})

添加数据使用add方法，传入一个obje【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】ct。但是这个object有限制，它的主未经授权，禁止复制转载。原创内容，盗版必究。键值，也就是id值，不能是已存在的，如果【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。objectStore中已经有了这个id【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。，那么会报错。因此，在某些程序中，为了避本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。免这种情况的发生，我们使用put方法。

著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。【本文受版权保护】

更新数据【本文首发于唐霜的博客】

【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】转载请注明出处：www.tangshuang.net

let transaction = db.transaction(['myObjectStore'], 'readonly')
let objectStore = transaction.objectStore('myObjectStore')
let request = objectStore.put({
 id: '100002',
 name: 'Zhang Fei',
})

put方法和add方法有两大区别。一，如本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。果objectStore中已经有了该id【作者：唐霜】【原创内容，转载请注明出处】，则表示更新这个object，如果没有，【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】则添加这个object。二，在另一种情况转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】下，也就是设置了autoIncremen【转载请注明来源】著作权归作者所有，禁止商业用途转载。t为true的时候，也就是主键自增的时候著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。，put方法必须传第二个参数，第二个参数【版权所有，侵权必究】【转载请注明来源】是主键的值，以此来确定你要更新的是哪一个著作权归作者所有，禁止商业用途转载。【本文受版权保护】主键对应的object，如果不传的话，可原创内容，盗版必究。【转载请注明来源】能会直接增加一个object到数据库中。未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。从这一点上讲，自增字段确实比较难把握，因【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】此我建议开发者严格自己在传入时保证obj【本文首发于唐霜的博客】【关注微信公众号：wwwtangshuangnet】ect中存在主键值。

【作者：唐霜】【未经授权禁止转载】【版权所有，侵权必究】【未经授权禁止转载】原创内容，盗版必究。

删除数据本文版权归作者所有，未经授权不得转载。

本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。

let transaction = db.transaction(['myObjectStore'], 'readonly')
let objectStore = transaction.objectStore('myObjectStore')
let request = objectStore.delete('100001')

delete方法把你传入的主键值对应的o【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】bject从数据库中删除。

【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net

IndexedDB API【原创内容，转载请注明出处】

【转载请注明来源】转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。

本节主要把indexedDB中最常用的所本文版权归作者所有，未经授权不得转载。【作者：唐霜】有api进行列举，起到快速查阅的作用。注【版权所有】唐霜 www.tangshuang.net【作者：唐霜】意，这里仅是最常用，基本可以覆盖90%的【本文受版权保护】未经授权，禁止复制转载。使用场景，但并不代表所有的api都在这里原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。，你可以通过这里本文作者：唐霜，转载请注明出处。查阅全部。本文作者：唐霜，转载请注明出处。

本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】

I【访问 www.tangshuang.net 获取更多精彩内容】D【版权所有】唐霜 www.tangshuang.netB本文作者：唐霜，转载请注明出处。Database【版权所有】唐霜 www.tangshuang.net

【关注微信公众号：wwwtangshuangnet】【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】

也就是本文最开始使用open打开inde【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】xedBD得到的db对象db，通过这节，了解这个idb有些什么接口可原创内容，盗版必究。【版权所有，侵权必究】以被调用。

原创内容，盗版必究。未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】

let request = indexedDB.open(name, version)
request.onsuccess = (e) => {
  let db = e.target.result // 获得db
}

name【本文首发于唐霜的博客】

转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net

通过idb.name获取当前连接到的数据【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。库的名字。这和你在open的时候传入的n【本文首发于唐霜的博客】【转载请注明来源】ame是一致的。

转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net

version【版权所有，侵权必究】

【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。

和你在open的时候传入的version【转载请注明来源】【版权所有】唐霜 www.tangshuang.net是一致的。

【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net

objectStoreNames转载请注明出处：www.tangshuang.net

著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】

获取当前数据库的所有objectStor未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。e的name列表，是一个数组。

【本文首发于唐霜的博客】【作者：唐霜】【本文首发于唐霜的博客】未经授权，禁止复制转载。

createObjectStore()本文作者：唐霜，转载请注明出处。

【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net

创建一个objectStore，有两个参【版权所有，侵权必究】原创内容，盗版必究。数：

【作者：唐霜】【转载请注明来源】原创内容，盗版必究。【作者：唐霜】

• name：要创建的objectStore【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。的name
【转载请注明来源】【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。【未经授权禁止转载】
• options：选项 【访问 www.tangshuang.net 获取更多精彩内容】
  • keyPath：主键，你将要存入的obj【未经授权禁止转载】转载请注明出处：www.tangshuang.netect的一个property name，【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net比如每一个object都有一个id属性，转载请注明出处：www.tangshuang.net【本文受版权保护】那么可以使用id作为keyPath，在查本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。询的时候，get方法的参数，是id值
  【转载请注明来源】【版权所有，侵权必究】【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】
  • autoIncrement：keyPat未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。h是否自增，如果为true，那么你在添加【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】一个object的时候，可以不用传id，未经授权，禁止复制转载。【本文首发于唐霜的博客】id会自动加1。但是这样的话，你就不知道【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。你的这个object的id值到底是多少，【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net所以不建议使用。默认为false
  本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】
【本文首发于唐霜的博客】【作者：唐霜】【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。

例子：【原创内容，转载请注明出处】

【版权所有，侵权必究】【原创内容，转载请注明出处】原创内容，盗版必究。

db.createObjectStore('students', { keyPaht: 'id', autoIncrement: false })

deleteObjectStore()【原创不易，请尊重版权】

【原创内容，转载请注明出处】【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。

删除一个objectStore，参数只有转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net一个：

未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。

• name：要删除的objectStore【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。的name
【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。

删除的时候，它的所有index也被删除了【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.net。

本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】【未经授权禁止转载】【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.net

close()著作权归作者所有，禁止商业用途转载。

【本文受版权保护】本文版权归作者所有，未经授权不得转载。【本文受版权保护】【原创内容，转载请注明出处】

关闭当前打开的这个数据库。关闭之后，任何本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。操作都会报错。

【作者：唐霜】【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。

transaction()【版权所有】唐霜 www.tangshuang.net

【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】【原创不易，请尊重版权】

重头戏，开启一个事务，是后续操作的开始。【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net前文已经讲过了，任何操作都是要在事务中进【转载请注明来源】【版权所有】唐霜 www.tangshuang.net行的，对于一个database而言，如果【作者：唐霜】【版权所有】唐霜 www.tangshuang.net要获取里面的数据，或者修改其中的某一个o原创内容，盗版必究。未经授权，禁止复制转载。bjectStore，都要通过这个方法来原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。开启一个事务，在事务中进行操作。

原创内容，盗版必究。转载请注明出处：www.tangshuang.net原创内容，盗版必究。【版权所有，侵权必究】【本文受版权保护】

它有两个参数：【作者：唐霜】

本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。【本文受版权保护】

• objectStoreNames：一个数【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】组，表示你开启的这个事务，要准备对哪些o【转载请注明来源】【转载请注明来源】bjectStore进行操作，在这个事务【本文受版权保护】【本文受版权保护】中，只有这些objectStore能被选【未经授权禁止转载】原创内容，盗版必究。中，如果你选中其他的objectStor【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。e，会报错。
转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】
• mode：读写权限，主要可用的值：rea本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】donly, readwrite
【作者：唐霜】【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。

我们用代码来看下用法：【访问 www.tangshuang.net 获取更多精彩内容】

本文版权归作者所有，未经授权不得转载。【本文受版权保护】本文版权归作者所有，未经授权不得转载。【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】

let tx = idb.transaction(['students'], 'readonly')

这样就获得了一个database的事务容转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。器。

转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net【本文受版权保护】

database的api主要用到的就这些著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。了，接下来，我们来看下，开启事务之后，我【本文首发于唐霜的博客】【转载请注明来源】们可以干什么。

【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】【原创不易，请尊重版权】未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。

I【关注微信公众号：wwwtangshuangnet】D【访问 www.tangshuang.net 获取更多精彩内容】B【本文受版权保护】Transaction【关注微信公众号：wwwtangshuangnet】

【转载请注明来源】原创内容，盗版必究。【原创内容，转载请注明出处】

关于transaction的概念前面已经【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】说了，这里主要看下，得到一个transa【作者：唐霜】原创内容，盗版必究。ction之后可以干什么。

【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。

db未经授权，禁止复制转载。

【转载请注明来源】著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】【本文首发于唐霜的博客】

获取这个transaction是对哪个d【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。atabase进行操作的事务。

【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net【作者：唐霜】

objectStoreNames【转载请注明来源】

【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。【作者：唐霜】本文作者：唐霜，转载请注明出处。【本文受版权保护】

这个事务要对哪些objectStore进【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net行操作，和你传入的objectStore【作者：唐霜】【转载请注明来源】Names是一致的，是一个数组。

【未经授权禁止转载】【作者：唐霜】【关注微信公众号：wwwtangshuangnet】

mode【原创内容，转载请注明出处】

【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】

读写权限，和你传入的mode一致。本文版权归作者所有，未经授权不得转载。

【本文受版权保护】未经授权，禁止复制转载。【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】

abort()本文作者：唐霜，转载请注明出处。

【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】原创内容，盗版必究。

终止该事务，一旦人为终止，你程序中的某些【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。操作就不会再执行了。

原创内容，盗版必究。【转载请注明来源】原创内容，盗版必究。

objectStore()【原创内容，转载请注明出处】

未经授权，禁止复制转载。原创内容，盗版必究。原创内容，盗版必究。【原创不易，请尊重版权】

获取事务中的某个objectStore的【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。容器。它有一个参数：

转载请注明出处：www.tangshuang.net原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。

• name：objectStore的nam【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.nete
【本文受版权保护】【作者：唐霜】【作者：唐霜】本文作者：唐霜，转载请注明出处。【作者：唐霜】

获得该objectStore容器之后，就【原创不易，请尊重版权】【版权所有，侵权必究】可以利用它进行objectStore的数本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】据增删改查了。

著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】【转载请注明来源】

let tx = idb.transaction(['students'], 'readonly')
let objStore = tx.objectStore('students')

// 利用objStore进行查询：
let request = objStore.get('100001')

注意，它的参数必须是在transacti【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】on的第一个参数数组中的。

原创内容，盗版必究。原创内容，盗版必究。【版权所有，侵权必究】【原创内容，转载请注明出处】

I本文作者：唐霜，转载请注明出处。D【原创内容，转载请注明出处】B原创内容，盗版必究。Object本文版权归作者所有，未经授权不得转载。Store【原创内容，转载请注明出处】

【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。【作者：唐霜】未经授权，禁止复制转载。

重头戏，objectStore是最核心的【未经授权禁止转载】【未经授权禁止转载】概念了，它的容器，也就是上面这段代码中的objStore，都可以进行哪些后续操作呢？【本文首发于唐霜的博客】

未经授权，禁止复制转载。【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。

name本文版权归作者所有，未经授权不得转载。

著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】原创内容，盗版必究。原创内容，盗版必究。【作者：唐霜】

获取该objectStore的name。【版权所有，侵权必究】转载请注明出处：www.tangshuang.net和创建的时候传入的name一致。

【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】【原创不易，请尊重版权】【访问 www.tangshuang.net 获取更多精彩内容】

keyPath【未经授权禁止转载】

【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】

和创建的时候传入的keyPath一致。本文版权归作者所有，未经授权不得转载。

【版权所有，侵权必究】转载请注明出处：www.tangshuang.net【作者：唐霜】

autoIncrement本文作者：唐霜，转载请注明出处。

本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】

和创建的时候传入的autoIncreme【本文受版权保护】原创内容，盗版必究。nt一致。

未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。

indexNames【本文受版权保护】

本文版权归作者所有，未经授权不得转载。【转载请注明来源】未经授权，禁止复制转载。【原创内容，转载请注明出处】

获取该objectStore的所有索引的【本文受版权保护】【作者：唐霜】命名列表，和createIndex传入的【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。第一个参数一致。

本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。

transaction【本文首发于唐霜的博客】

【原创不易，请尊重版权】【转载请注明来源】【转载请注明来源】【版权所有】唐霜 www.tangshuang.net

获取该objectStore所属的tra【作者：唐霜】转载请注明出处：www.tangshuang.netnsaction的容器。一个object【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。Store的容器，只有在事务中才能得到，【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net因此这个objectStore的容器一定【本文首发于唐霜的博客】未经授权，禁止复制转载。属于某个事务，那么也就有对应的trans【本文受版权保护】转载请注明出处：www.tangshuang.netaction容器。通过transacti【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】on容器，其实可以做很多操作，比如获取和本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】该objectStore一起操作的其他o转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.netbjectStore的name。

原创内容，盗版必究。本文作者：唐霜，转载请注明出处。【转载请注明来源】

get()著作权归作者所有，禁止商业用途转载。

【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。

发起一个获取object的Request【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。。Request我们还没有讲到，后面会讲【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.net。它有一个参数：

【版权所有，侵权必究】未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】

• key：主键的值，比如你要获取一个id=【版权所有，侵权必究】【转载请注明来源】100001的object，那么key应【关注微信公众号：wwwtangshuangnet】【本文受版权保护】该传入100001
转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】

代码说话：本文版权归作者所有，未经授权不得转载。

著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。

let objStore = tx.objectStore('students')
let request = objStore.get(100001)

而要得到最后查询到的object，需要在本文作者：唐霜，转载请注明出处。【转载请注明来源】request的onsuccess中获取未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】。所以后面讲完Request之后，你就能【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】正确使用代码了。

【本文受版权保护】本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】

add()著作权归作者所有，禁止商业用途转载。

【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【本文受版权保护】【作者：唐霜】【本文受版权保护】

发起一个添加object的Request本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。。它有一个参数：

【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net【未经授权禁止转载】

• object：要添加的object，ob【本文首发于唐霜的博客】【原创不易，请尊重版权】ject应该包含主键，这取决于autoI【访问 www.tangshuang.net 获取更多精彩内容】【原创不易，请尊重版权】ncrement是否为true
【作者：唐霜】【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】

还是用代码来看下：【访问 www.tangshuang.net 获取更多精彩内容】

未经授权，禁止复制转载。未经授权，禁止复制转载。未经授权，禁止复制转载。【作者：唐霜】

let objStore = tx.objectStore('students')
let request = objStore.add({
  id: '100002',
  name: 'Li Hua',
})

delete()本文版权归作者所有，未经授权不得转载。

未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】

发起一个删除object的Request【作者：唐霜】【关注微信公众号：wwwtangshuangnet】。它有一个参数：

【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】

• key: 主键值，和get一样。【版权所有】唐霜 www.tangshuang.net
著作权归作者所有，禁止商业用途转载。【本文受版权保护】本文作者：唐霜，转载请注明出处。

put()【版权所有】唐霜 www.tangshuang.net

转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。

发起一个更新某个object的Reque【转载请注明来源】【未经授权禁止转载】st。它有两个参数：

【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】

• object：要更新的object【作者：唐霜】
转载请注明出处：www.tangshuang.net【转载请注明来源】著作权归作者所有，禁止商业用途转载。
• key：要更新的object的主键值【访问 www.tangshuang.net 获取更多精彩内容】
【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net原创内容，盗版必究。

关于key非常难理解。当你在创建一个ob【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。jectStore的时候，你可能会传入a【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.netutoIncrement为true，这时转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net，这个objectStore和我们经常使转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】用的有点不同。比如你的主键是id，那么如【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】果你在add或put的时候，不传这个id著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。，id值会自动加1，你get到的obje【原创不易，请尊重版权】【作者：唐霜】ct也会包含id属性。

【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。【作者：唐霜】

当你在使用put方法去更新的时候，如果你本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。的objectStore的autoInc【原创内容，转载请注明出处】【版权所有，侵权必究】rement是true，就必须传入第二个【原创不易，请尊重版权】原创内容，盗版必究。参数key，put方法会先通过key找到本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】该object，然后在用object的内【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】容去更新。而如果不传key，那么你传入的【本文受版权保护】【原创内容，转载请注明出处】第一个参数object中必须包含id，否【本文受版权保护】【版权所有，侵权必究】则会报错。
【作者：唐霜】转载请注明出处：www.tangshuang.net 但是如果你的autoIncrement转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】设置的是false，那就可以考虑忽略ke转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。y。但是效果还是不一样，当你传入key值【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net的时候，会更新传入的key对应的那个ob未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】ject。不传的时候，根据你object【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】里面的主键来更新，没有的话会被认为是ad未经授权，禁止复制转载。未经授权，禁止复制转载。d操作，不会报错。

【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。

所以比较好的一种操作是，不设置autoI【本文受版权保护】原创内容，盗版必究。ncrement，无论是添加还是修改ob未经授权，禁止复制转载。原创内容，盗版必究。ject，都使用put，只要开发者自己注【转载请注明来源】本文作者：唐霜，转载请注明出处。意，传入的object一定要有一个主键即【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】可。这样当存在该主键值时，就更新，不存在【版权所有，侵权必究】【版权所有，侵权必究】时就插入。这比使用add好很多，因为ad原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.netd的时候，如果存在会报错。

【未经授权禁止转载】【原创不易，请尊重版权】【作者：唐霜】

如果你还有不理解的地方，欢迎在下方留言，【本文受版权保护】【本文受版权保护】对这个问题进行探讨。

【未经授权禁止转载】转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net

count()本文版权归作者所有，未经授权不得转载。

原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】

没有参数，发起一个查询当前objectS原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.nettore的所有object的数量的Req本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。uest。

未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。【转载请注明来源】著作权归作者所有，禁止商业用途转载。

clear()【版权所有】唐霜 www.tangshuang.net

【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】

没有参数，发起一个删除objectSto【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。re里面的所有object的Reques【本文受版权保护】本文版权归作者所有，未经授权不得转载。t。

本文作者：唐霜，转载请注明出处。原创内容，盗版必究。原创内容，盗版必究。【版权所有，侵权必究】

清除数据之前请备份好数据。著作权归作者所有，禁止商业用途转载。

【本文首发于唐霜的博客】原创内容，盗版必究。【本文受版权保护】本文作者：唐霜，转载请注明出处。

openCursor()本文版权归作者所有，未经授权不得转载。

【未经授权禁止转载】未经授权，禁止复制转载。【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】【关注微信公众号：wwwtangshuangnet】

发起一个打开游标的Request。它的参本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。数统一在IDBCursor中讲。

转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.net【转载请注明来源】

index()【未经授权禁止转载】

本文版权归作者所有，未经授权不得转载。【转载请注明来源】转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【本文受版权保护】

通过index方法，可以建立一个类似SQ本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。L数据库中视图。它先得到一个IDBInd【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.netex，然后你在对这个IDBIndex进行本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。操作。因此它不是发起一个Request，转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net这有别于前面的方法。返回的IDBInde未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。x会在下文详细描述它的API。index著作权归作者所有，禁止商业用途转载。【本文受版权保护】方法由一个参数：

著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。

• indexName：要用来作为索引视图的原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。索引名称
未经授权，禁止复制转载。原创内容，盗版必究。【转载请注明来源】【未经授权禁止转载】

看下代码怎么用：【版权所有】唐霜 www.tangshuang.net

本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。

let objStore = tx.objectStore('students')
let objIndex = objStore.index('name')
let request = objIndex.get('Li Hua')

createIndex()本文版权归作者所有，未经授权不得转载。

【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。

创建一个索引，和前面的方法不同，它不是发【本文首发于唐霜的博客】未经授权，禁止复制转载。起一个Request，而是直接进行操作，著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】并且返回一个IDBIndex。关于IDB【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。Index，我会在Request后面再讲转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。。它有三个参数：

本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net【转载请注明来源】

• indexName：索引的名字，自己规定著作权归作者所有，禁止商业用途转载。【作者：唐霜】的，后面作为根据索引进行查询的依据
未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。【原创不易，请尊重版权】
• keyPath：该索引对应object中【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。的那个属性名，最好indexName和k【版权所有，侵权必究】【版权所有，侵权必究】eyPath相等，这样便于记忆
【本文受版权保护】【本文首发于唐霜的博客】【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】【本文首发于唐霜的博客】
• objectParameters： 【访问 www.tangshuang.net 获取更多精彩内容】
  • unique：这个索引是否是唯一，也就是未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。说所有object中，该属性值不能重复
  【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net
【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】

虽然objectParameters还有本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。其他选项，但是常用的就是unique。

著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。

注意，只能在onupgradeneede【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】d中使用。

【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。

deleteIndex()【关注微信公众号：wwwtangshuangnet】

未经授权，禁止复制转载。未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。

删除一个索引，也不用发起Request。【未经授权禁止转载】转载请注明出处：www.tangshuang.net它有一个参数：

本文版权归作者所有，未经授权不得转载。【作者：唐霜】本文版权归作者所有，未经授权不得转载。

• name：要删除的索引的name，和cr【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。eateIndex的时候传入的index【转载请注明来源】【版权所有】唐霜 www.tangshuang.netName一致。
著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】

删除索引之后，就不能再根据索引查询数据了【转载请注明来源】本文作者：唐霜，转载请注明出处。。

未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】

另外需要注意，创建和删除索引，都需要在打【本文首发于唐霜的博客】【作者：唐霜】开db的Request的onupgrad本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.neteneeded事件中完成。

原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。

IDBRequest【原创不易，请尊重版权】

【本文首发于唐霜的博客】【原创不易，请尊重版权】【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net

前面一直强调事务的概念，没有对Reque转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.netst进行介绍。Request是在事务过程本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。中，发起某项操作的请求。一个事务过程中，【原创不易，请尊重版权】【访问 www.tangshuang.net 获取更多精彩内容】可以有多个Request，Request著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。一定存在与事务中，因此它肯定会有一个tr本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.netansaction属性来获取它所属于的那著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。个事务的容器。

【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。

目前，在indexedDB中，有四种可能原创内容，盗版必究。【版权所有，侵权必究】产生Request：open datab【作者：唐霜】转载请注明出处：www.tangshuang.netase，objectStore requ著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。est, cursor request,著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。 index request。

【本文受版权保护】本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。

readyState【原创内容，转载请注明出处】

【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。【作者：唐霜】

Request的状态。只有两种状态：pe【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。nding, done。

未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。

transaction【访问 www.tangshuang.net 获取更多精彩内容】

【本文受版权保护】著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】

获取该Request所属于的transa【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。ction。

【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】

source【原创不易，请尊重版权】

【本文首发于唐霜的博客】【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net原创内容，盗版必究。【原创不易，请尊重版权】

获取该Request是由谁发起的，它可能【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net有四种情况：objStore, curs著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。or, index, null. 当该R【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】equest是open database【原创内容，转载请注明出处】【本文首发于唐霜的博客】的时候发起，source值为null。

原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】本文版权归作者所有，未经授权不得转载。

通过该source值，其实可以获取更多信【作者：唐霜】【本文受版权保护】息，比如objectStore的其他信息【未经授权禁止转载】【作者：唐霜】。

【转载请注明来源】【版权所有，侵权必究】【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】

result【本文受版权保护】

【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】未经授权，禁止复制转载。

获取该Request的输出结果。该值最开【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net始是undefined，只有当Reque本文作者：唐霜，转载请注明出处。【作者：唐霜】st成功之后，该值才会出现。因此，要获取著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。一个get的最终结果，必须在Reques未经授权，禁止复制转载。【作者：唐霜】t的onsuccess事件中调用：

未经授权，禁止复制转载。【作者：唐霜】本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。

let request = objectStore.get(10001)
request.onsuccess = e => {
  let item = request.result
  // 等价于
  let item = e.tareget.result
}

IDBIndex【版权所有，侵权必究】

【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net

索引的概念就不讲了，这里主要是把最常用的【本文受版权保护】转载请注明出处：www.tangshuang.net有关所有的api列举出来，方便使用。

【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】

什么情况下会产生IDBIndex呢？当调本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net用一个objectStore的index【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net方法时，前文在讲IDBObjectSto【转载请注明来源】【版权所有】唐霜 www.tangshuang.netre的时候已经讲到过了。

【转载请注明来源】【未经授权禁止转载】【本文受版权保护】

let objStore = tx.objectStore('students')
let objIndex = objStore.index('name')

通过index方法之后，这个objInd【版权所有，侵权必究】【转载请注明来源】ex可以进行哪些操作呢？

【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net

name【转载请注明来源】

转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。【作者：唐霜】【原创不易，请尊重版权】

该属性可以获取index的name。原创内容，盗版必究。

【转载请注明来源】转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】【原创不易，请尊重版权】

keyPath原创内容，盗版必究。

未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。

该属性可以获取index的keyPath【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】，也就是object的某个属性的名字。这【未经授权禁止转载】【本文首发于唐霜的博客】个你在createIndex的时候传入的【本文受版权保护】【未经授权禁止转载】keyPath是一致的。

转载请注明出处：www.tangshuang.net【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】

unique【关注微信公众号：wwwtangshuangnet】

原创内容，盗版必究。【原创内容，转载请注明出处】原创内容，盗版必究。【作者：唐霜】

返回是否是唯一的，和你createInd【作者：唐霜】未经授权，禁止复制转载。ex的时候传入的值是一致的。

【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】

isAutoLocale本文版权归作者所有，未经授权不得转载。

原创内容，盗版必究。本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】

返回一个boolean值，它表示这个in本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。dex是否是自增的，和前面的autoIn【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。crement有关。

【作者：唐霜】【原创不易，请尊重版权】原创内容，盗版必究。

locale原创内容，盗版必究。

未经授权，禁止复制转载。【版权所有，侵权必究】【本文首发于唐霜的博客】【本文首发于唐霜的博客】【关注微信公众号：wwwtangshuangnet】

如果这个index对应的字段是自增的，那本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】么现在的自增基础值是多少？比如你的id是【本文受版权保护】著作权归作者所有，禁止商业用途转载。自增的，现在objectStore里面有【转载请注明来源】【版权所有】唐霜 www.tangshuang.net10个object，这时objIndex【作者：唐霜】未经授权，禁止复制转载。.locale应该是10.

【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】

objectStore【版权所有】唐霜 www.tangshuang.net

【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】【原创不易，请尊重版权】【转载请注明来源】

因为IDBIndex总是通过object【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。Store的index方法产生的，所以它【本文首发于唐霜的博客】【本文首发于唐霜的博客】自然会有对应的那个objectStore未经授权，禁止复制转载。【原创内容，转载请注明出处】，而自己的objectStore属性正好著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】是一个引用，指向那个产生自己的objec【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。tStore。

【关注微信公众号：wwwtangshuangnet】【本文受版权保护】【关注微信公众号：wwwtangshuangnet】【转载请注明来源】

count()本文版权归作者所有，未经授权不得转载。

著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】

发起一个当前index视图总共有多少个o【关注微信公众号：wwwtangshuangnet】【原创不易，请尊重版权】bject的Request。

【未经授权禁止转载】【转载请注明来源】转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。【转载请注明来源】

get()【转载请注明来源】

本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】

发起一个从当前index获取一个值为传入本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net参数的object的Request。它有【作者：唐霜】未经授权，禁止复制转载。一个参数：

【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。

• key: 这个key其实是指你的inde【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】x的keyPath的值
转载请注明出处：www.tangshuang.net【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】【作者：唐霜】

这里的key有点难理解，前面object未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。Store的get方法传入的是主键的值，本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】而这类的get传入的是你选择的这个索引对未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】应的属性的值。比如说：

【本文首发于唐霜的博客】【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net【转载请注明来源】本文版权归作者所有，未经授权不得转载。

{
  id: 1,
  name: 'tom',
}

id是主键，name是一个索引。那么这个【转载请注明来源】原创内容，盗版必究。时候，如果你想得到这个object，应该【本文首发于唐霜的博客】【未经授权禁止转载】使用:

【本文首发于唐霜的博客】未经授权，禁止复制转载。【本文受版权保护】【版权所有，侵权必究】未经授权，禁止复制转载。

let request = objIndex.get('tom') // 这个tom是name属性的值

openCursor()【关注微信公众号：wwwtangshuangnet】

本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。【转载请注明来源】

发起一个打开游标的Request。它的参【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。数统一在IDBCursor中讲。

本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。

可以看出，objIndex对于objSt原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.netore而言，方法少了很多，它不能更新、删原创内容，盗版必究。【转载请注明来源】除等。但是实际上，通过objectSto转载请注明出处：www.tangshuang.net【未经授权禁止转载】re属性，就可以反过来对objectSt本文版权归作者所有，未经授权不得转载。【转载请注明来源】ore进行操作。

【本文首发于唐霜的博客】原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。

IDBCursor【关注微信公众号：wwwtangshuangnet】

本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】

游标通过前文的阐述，应该比较容易理解了。【本文受版权保护】本文版权归作者所有，未经授权不得转载。这里我们来看下，一个cursor都可以进未经授权，禁止复制转载。【转载请注明来源】行哪些操作。

【版权所有，侵权必究】转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】

但是在开始之前，你要回头看下游标是怎么得著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。到的？

【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。【转载请注明来源】【作者：唐霜】

openCursor()【关注微信公众号：wwwtangshuangnet】

【本文首发于唐霜的博客】未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】

objectStore或objectIn著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。dex可以使用这个方法打开一个游标的Re【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】quest。它有两个参数：

转载请注明出处：www.tangshuang.net原创内容，盗版必究。未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】【转载请注明来源】

• range：游标的值域，也就是说，游标在著作权归作者所有，禁止商业用途转载。【作者：唐霜】遍历过程中，仅对值域范围内的那些obje【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】ct进行遍历
本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。【本文受版权保护】本文版权归作者所有，未经授权不得转载。
• direction：遍历的方向，有如下选【本文受版权保护】【版权所有】唐霜 www.tangshuang.net择：next，nextunique，pr本文版权归作者所有，未经授权不得转载。【本文受版权保护】ev，prevunique。看名字应该就【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】可以理解了。
未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。【转载请注明来源】本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】

打开游标后，游标怎么获得呢？在Reque【作者：唐霜】【版权所有】唐霜 www.tangshuang.netst的onsuccess中得到的：

原创内容，盗版必究。【作者：唐霜】著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。

objStore.openCursor().onsuccess = e => {
  let cursor = e.target.result // 这个才是我们要的游标
}

接下来就是看看，这个cursor有哪些接著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。口。

【原创不易，请尊重版权】【作者：唐霜】转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】

direction【作者：唐霜】

本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net

游标遍历的方向，方向前面说过了，和你op转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】enCursor的时候传入的是一致的。

著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net【作者：唐霜】【原创不易，请尊重版权】

key【作者：唐霜】

本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。

把当前游标所在的那个object的值返回【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】给你，这个值是你使用index方法时，选【本文首发于唐霜的博客】【原创内容，转载请注明出处】择的那个索引对应的属性的值。有点绕，举个【版权所有，侵权必究】【作者：唐霜】例子，如果游标当前停留在：

【作者：唐霜】原创内容，盗版必究。本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。

{
  id: 2,
  name: 'sue',
}

而你开启这个游标，又是通过转载请注明出处：www.tangshuang.netobjStore.index('name').openCursor()开启的，那么这个时候这个key值，就是s转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.netue了。

【本文首发于唐霜的博客】原创内容，盗版必究。转载请注明出处：www.tangshuang.net

primaryKey【作者：唐霜】

【版权所有，侵权必究】未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。

游标遍历所在位置的object的主键。这转载请注明出处：www.tangshuang.net【版权所有，侵权必究】个比较难理解，key和primaryKe【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.nety的区别主要体现在你用索引进行检索的时候【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。，如果你openCursor是在非索引集【作者：唐霜】著作权归作者所有，禁止商业用途转载。合情况下，其实key和primaryKe【本文首发于唐霜的博客】未经授权，禁止复制转载。y是一样的，因为都是以主键作为索引。但是【版权所有，侵权必究】【本文受版权保护】当你用index方法筛选出子集，那么这个【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。时候primaryKey在某些情况下就非原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】常有必要知道。

著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】

source本文版权归作者所有，未经授权不得转载。

本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】【本文受版权保护】【未经授权禁止转载】【原创内容，转载请注明出处】

该属性返回开启游标的容器的引用，也就是o著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.netbjStore或objIndex。

本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。

value【关注微信公众号：wwwtangshuangnet】

未经授权，禁止复制转载。【作者：唐霜】本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】

改属性返回当前遍历到的object，严格本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。的说，这个属性是IDBCursorWithValue的属性。【关注微信公众号：wwwtangshuangnet】

【转载请注明来源】【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】未经授权，禁止复制转载。

continue()【访问 www.tangshuang.net 获取更多精彩内容】

【原创内容，转载请注明出处】未经授权，禁止复制转载。【原创内容，转载请注明出处】

游标往下移动一格或移动到你规定的位置。注【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】意，它是根据你规定的方向进行移动的。它可【原创内容，转载请注明出处】未经授权，禁止复制转载。以有一个参数：

【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】

• key：你想要移动游标到指定位置的值。比【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。如说你想让游标移动到id=4的那个obj本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。ect，那么这里传入4.
【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。【转载请注明来源】【本文受版权保护】【版权所有】唐霜 www.tangshuang.net

advance()【版权所有】唐霜 www.tangshuang.net

【版权所有，侵权必究】【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】

continue()是只移动一格，adv未经授权，禁止复制转载。【原创内容，转载请注明出处】ance()可以自己规定移动的格数。它有转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】一个参数：

本文版权归作者所有，未经授权不得转载。【作者：唐霜】【转载请注明来源】【本文首发于唐霜的博客】

• count：你规定的往前移动的格数。著作权归作者所有，禁止商业用途转载。
未经授权，禁止复制转载。【原创内容，转载请注明出处】【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。

continuePrimaryKey()

【原创内容，转载请注明出处】【原创内容，转载请注明出处】【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。

前面讲了primaryKey这个属性，也【作者：唐霜】【版权所有】唐霜 www.tangshuang.net讲了continue(key)这个方法的未经授权，禁止复制转载。【版权所有，侵权必究】参数key。但是，当你在openCurs【原创内容，转载请注明出处】【本文受版权保护】or的时候，索引的值可重复时，那就会出现未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net尴尬的情况。在objectStore里面【原创不易，请尊重版权】【未经授权禁止转载】存储数据的时候，primaryKey和其【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】他索引的key，它们的值可能是重复的，但转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。是如果通过两个key的值来确定呢？那么就【未经授权禁止转载】转载请注明出处：www.tangshuang.net能更准确的定位某一个object。因此，原创内容，盗版必究。【原创内容，转载请注明出处】当你使用continuPrimaryKe【版权所有，侵权必究】转载请注明出处：www.tangshuang.nety的时候，是为了解决这个问题，即cont【本文受版权保护】【未经授权禁止转载】inue()只会根据参数，往下移动到下一未经授权，禁止复制转载。原创内容，盗版必究。个给定参数值的object，而如果使用c【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.netontinuePrimaryKey()，【未经授权禁止转载】原创内容，盗版必究。那么在往下一个给定值移动时，还会再考虑p【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。rimaryKey的值。

转载请注明出处：www.tangshuang.net【作者：唐霜】本文作者：唐霜，转载请注明出处。【转载请注明来源】

一般来说primaryKey的值都是唯一本文作者：唐霜，转载请注明出处。【作者：唐霜】的，但也不排除有些情况不唯一的时候，这个著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】时候，使用游标结合continuePri【作者：唐霜】【转载请注明来源】maryKey才能正确获得你想要的那个o未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。bject，通过普通的get只能得到第一【未经授权禁止转载】【作者：唐霜】个object。

【版权所有】唐霜 www.tangshuang.net【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】

delete()【未经授权禁止转载】

【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】本文作者：唐霜，转载请注明出处。

发起一个删除当前游标所在的object的【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】Request。删除之后，就要考虑用co【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】ntinuePrimaryKey()，而未经授权，禁止复制转载。【作者：唐霜】不是continue()。

【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】【作者：唐霜】【本文受版权保护】

update()【版权所有，侵权必究】

转载请注明出处：www.tangshuang.net【未经授权禁止转载】【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.net

发起一个更新当前游标所在的这个objec转载请注明出处：www.tangshuang.net原创内容，盗版必究。t的对应字段的值的Request。它有一【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。个参数：

未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net

• value：要用这个新的值替换掉老的值。【未经授权禁止转载】【本文受版权保护】注意，不是替换掉整个object，而只是著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。更新你选中的那个key的值。
【未经授权禁止转载】【版权所有，侵权必究】【作者：唐霜】【作者：唐霜】

小结【版权所有，侵权必究】

【作者：唐霜】本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net【转载请注明来源】【原创不易，请尊重版权】

本文所有的内容就讲完了，本文从 Inde【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.netxedDB 的概念和结构开始，把所有常用【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。的 API 都讲了一遍，并且还给出了很多本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。例子。
【原创内容，转载请注明出处】原创内容，盗版必究。 有人做过一个预测，Web SQL 数据未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net库已经从标准中移除了，有可能在后面的浏览原创内容，盗版必究。【本文首发于唐霜的博客】器版本中被去除，IndexedDB 将有【版权所有，侵权必究】转载请注明出处：www.tangshuang.net可能统一浏览器本地化存储的数据库。

【关注微信公众号：wwwtangshuangnet】【本文受版权保护】【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】

虽然本文对大部分 IndexedDB 的【作者：唐霜】原创内容，盗版必究。接口都进行了讲解，但是还只是入门教程，还【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net有很多东西没讲。举个例子，作为数据库，最【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net重要的就是检索功能，也就是索引检索的那个本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】部分，但是本文并没有对这个部分展开。索引【本文首发于唐霜的博客】【原创不易，请尊重版权】检索还可以实现阈值检索，比如检索某一段日【未经授权禁止转载】原创内容，盗版必究。期内的所有 object，比如检索所有同转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】姓氏的同学，这些问题都是经常遇到的，但都本文作者：唐霜，转载请注明出处。原创内容，盗版必究。不再本文的讲解范围内。想要完全了解 in未经授权，禁止复制转载。原创内容，盗版必究。dexedDB，还需要你继续深入学习。

【版权所有，侵权必究】【作者：唐霜】【版权所有】唐霜 www.tangshuang.net【转载请注明来源】

参考文献【本文首发于唐霜的博客】

【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】

1. HTML5 indexedDB前端本地存【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】储数据库实例教程
【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。
2. indb本文作者：唐霜，转载请注明出处。 可能是最便捷的 indexedDB 操著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。作库
著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】【版权所有，侵权必究】【转载请注明来源】
3. Dexie.js本文版权归作者所有，未经授权不得转载。 将 indexeddb 封装成类 sq【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.netl 操作的库
【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。【本文受版权保护】

如果你觉得本书对你有帮助，通过下方的二维码向我打赏吧，帮助我写出更多有用的内容。

2017-09-09 | indexedDB