周末趁没事，就把之前写的一个包重新写了一本文版权归作者所有，未经授权不得转载。【转载请注明来源】遍。这个包的作用是为开发者提供更加快捷的【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。indexedDB操作，免除一切烦恼，开【作者：唐霜】【版权所有】唐霜 www.tangshuang.net箱就用起来。indexedDB是web标本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net准，被大部分现代浏览器完整支持。和loc原创内容，盗版必究。【本文受版权保护】alStorage不同的是，indexe【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。dDB是真的完整存储js对象的引擎，它甚未经授权，禁止复制转载。原创内容，盗版必究。至支持存储new Date()的值，其他【本文受版权保护】【转载请注明来源】一些基础的js对象类型也可能是支持的。而本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】localStorage是只能存储字符串著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】的，要存储对象，必须通过JSON等进行序【版权所有】唐霜 www.tangshuang.net【本文受版权保护】列化，而JSON不支持循环嵌套。另外一点未经授权，禁止复制转载。【原创内容，转载请注明出处】就是，localStorage是同步的，本文作者：唐霜，转载请注明出处。【本文受版权保护】indexedDB是异步的。

基于对复杂的indexedDB原生接口进【本文受版权保护】【本文首发于唐霜的博客】行封装的思路，我发布了hello-ind【本文首发于唐霜的博客】【关注微信公众号：wwwtangshuangnet】exeddb这个包，可以通过下面这个命令著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。安装

npm install --save hello-indexeddb

完整的文档在github上，【本文首发于唐霜的博客】可以点击这里阅读本文作者：唐霜，转载请注明出处。。都是key-value数据库，它和lo【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。calStorage的本质区别在哪里呢？【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。我认为数据库的本质能力是分层检索能力。检【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net索能力对于localStorage简直就【未经授权禁止转载】原创内容，盗版必究。是无，它只能通过一个key得到一个val本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】ue，而且是字符串的。而indexedD【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.netB可以通过创建索引进行检索，查询某个ob原创内容，盗版必究。本文作者：唐霜，转载请注明出处。ject的时候，可以通过主键快速get，转载请注明出处：www.tangshuang.net原创内容，盗版必究。也可以通过索引来快速query，这里的索未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net引在代码层面就是一个被记录的object【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。的属性。这看上去好像也没什么，比如我可以【作者：唐霜】【本文首发于唐霜的博客】通过构造多种变形的key来保存local【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。Storage，然后自己封装一套检索方法【转载请注明来源】【版权所有】唐霜 www.tangshuang.net来进行查询，甚至我自己构建一套local本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。Storage的索引来快速查询。这当然是著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。可以的，从这点上来讲，indexedDB【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。甚至没有localStorage有优势，【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】因为localStorage是同步的，更【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】直观，而且不会出现事件循环错误，也就不需【关注微信公众号：wwwtangshuangnet】【作者：唐霜】要事务机制。但是同步有同步的坏处，那就是转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】阻塞页面进程。

读完stackoverflow上的【关注微信公众号：wwwtangshuangnet】这个讨论【原创不易，请尊重版权】后我更加确信localStorage是有著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。局限的，也就是说，它真的真的仅仅适合那些原创内容，盗版必究。【本文受版权保护】非常小、碎片化的数据存储，而indexe【原创不易，请尊重版权】【版权所有，侵权必究】dDB才是完整的长久存储数据的解决方案。【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。这也就是说，在一个web应用中，应该合理【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。的选择使用localStorage还是i【原创不易，请尊重版权】【原创内容，转载请注明出处】ndexedDB。大家之所以那么青睐使用【关注微信公众号：wwwtangshuangnet】【作者：唐霜】localSotrage，最大的原因莫过【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】于它的接口太过简单了。不过想要让inde未经授权，禁止复制转载。未经授权，禁止复制转载。xedDB变得简单也非常容易，就是使用我【未经授权禁止转载】【未经授权禁止转载】上面的包。你甚至可以这么用：

async function() {
  let idb = new HelloIndexedDB({ key: 'key' })
  await idb.put({ key: 'my_key', value: 'my_value' })
  let obj = await idb.get('my_key')
}

就是这么简单，跟localStorage著作权归作者所有，禁止商业用途转载。【本文受版权保护】相比，就是异步和同步的区别。在对put这【原创内容，转载请注明出处】【原创不易，请尊重版权】个操作的适合，转换一下localStor著作权归作者所有，禁止商业用途转载。【本文受版权保护】age里面的set操作的思维，然后，就非【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】常自然的切换到了indexedDB的怀抱【原创内容，转载请注明出处】【作者：唐霜】里面。要知道，get回来的，是一个拥有上转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net下文的真实的js对象，而非字符串序列化和【版权所有，侵权必究】【未经授权禁止转载】反序列化的结果。

就这样，拥抱indexedDB吧～【关注微信公众号：wwwtangshuangnet】