介绍
indexeddb-js 是一个开源的 JavaScript 库，可以将 IndexedDB (浏览器本地数据库) 在不支持的浏览器上模拟出来，以达到兼容性的目的。
安装
这里我们建议使用 npm 来安装 indexeddb-js，命令如下：
npm install indexeddb-js
使用
indexeddb-js 是一个使用简单的库，以下是一个例子：
-- -------------------- ---- ------- ----- - ---------- ----------- - - ------------------------ -- ----- ----- ------- - ----------------------------- --------------- - --------------- - --------------------- ------ - - ------------------------ -- ----------------------- - --------------- - ----- -- - -------------------- ----- ----------- - --------------------------------- - -------- ---- --- ----- ----- - ------------------------------- ------- - ------- ----- --- -- -- ---- ----- ---------- - ----------------------------------------- ------------ ------------------------- ------ --- -- ----- ----- ----- ------ -------------- --- -------------------- - --------------- - ----------------- ----- ---------------- -- -- ---- ----- ---------- - ----------------------------------------- ------------------------- -------- -------------------- - --------------- - ------------------ - - ------------------------ - -- ------ - - --------------------------- --
深度分析
indexeddb-js 通过 JavaScript 模拟 IndexedDB API，使不支持 IndexedDB 的浏览器也能使用该 API。其核心代码就是将数据存储在浏览器的本地存储中，例如 LocalStorage 或者 SQLite 等。
下面我们通过阅读 indexeddb-js 源码来了解内部实现。
- indexeddb-js 引用了 indexedb 来进行本地存储的操作。
const indexedDb = require('indexedb');- 初始化 indexeddb-js
const helper = indexedDb.helper(targetStorage, options);
其中，targetStorage 参数为一个抽象的数据存储引擎，目前该库支持的存储引擎有 IndexedDB、WebSQL、LocalStorage 和 MemoryStorage；options 参数包括：
- version: 数据库版本（每次版本变化都会触发 onupgradeneeded 事件用于给存储库添加新的对象存储器或更新已有的存储器）；
- createObjectStore: 是否创建新的对象存储器；
- noblob: 当使用 WebSQL 时，是否禁用 Blob 插件(否则会出现 A potentially dangerous Request.Form value was detected from the client. )；
- indexeddb-js 的实现主要涉及增、查、删三个基本操作。下面将分别介绍每个操作的实现。
增加（插入）操作
indexeddb-js 支持对某个对象存储器中的数据进行插入操作。
const transaction = helper.transaction(['customer'], 'readwrite');
transaction.objectStore('customer').put(customer);其中，transaction.objectStore('customer') 方法用于获取一个对象存储器，该操作类似于获取一个 MySQL 数据库中的表。put 方法用于将数据插入到该对象存储器中。
查询操作
indexeddb-js 支持对某个对象存储器中的数据进行查询操作。
const transaction = helper.transaction(['customer']);
transaction.objectStore('customer').get(1);其中，get 方法用于获取该对象存储器中 key 值为 1 的对象；如果对象不存在，则返回 undefined。
删除操作
indexeddb 操作是基于事务的，所以删除操作的实现与插入操作类似。
const transaction = helper.transaction(['customer'], 'readwrite');
transaction.objectStore('customer').delete(1);其中，delete 方法用于删除该对象存储器中 key 值为 1 的对象。
总结
以上是关于 indexeddb-js 的详细使用教程和源码分析，希望对大家有所帮助。IndexedDB 是浏览器本地存储方案的一种，一般用于存储一些离线数据或者缓存数据。通过使用 indexeddb-js 库，可以很好的解决 IndexedDB 在不支持的浏览器的兼容性问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedca81b5cbfe1ea061242b