IDB（IndexedDB）是一种低级别的API，用于在Web浏览器中存储大量的结构化数据。IDB使用NoSQL数据库存储数据，支持键值对存储和索引操作。虽然IndexedDB非常强大，但它的API复杂，且难以使用，需要深入的JavaScript和数据库知识。
为此，IDBI工具应运而生：它提供了一组简化IndexedDB API的方法，使得在Web应用程序中使用IndexedDB成为一项容易且快速的任务。
在这篇文章中，我们将介绍如何使用NPM包idbi，它是一个基于Promise的表装IndexedDB库。我们将在本文中讨论如何使用idbi的方法和用法，同时提供示例代码和使用指南。让我们开始！
安装
在使用idbi之前，需要首先安装它。你可以使用NPM包管理器来安装它，命令如下：
npm install idbi
安装完成后，你可以使用idbi在项目中进行IndexedDB的操作了。
使用
使用idbi非常简单，它提供了一组简化的API用于在IndexedDB中执行提取、插入、更新和删除数据的操作。
打开数据库
首先，我们需要打开Object Store，可以使用 open 方法来打开它。例如，下面的代码片段展示如何使用idbi打开一个名为 MyDatabase 的IDB数据库：
-- -------------------- ---- -------
----- --- - ----------------
----- ---------- - --- -----
--------- -------------
-------- --
------- -
-
----- ----------
-------- -
-------- -----
-------------- -----
--
--
--
---
-- ------- -- --- --------
------------------------- -- --------------------- ------ ----------------在上面的代码中，我们实例化了一个名为 myDatabase 的IDB对象，并提供了数据库名称、版本号和要打开的Object Store列表。其中，Object Store名称为MyStore。我们指定了一个名为id的keyPath（主键），以向字符串自动递增的方式生成新ID（autoIncrement）。
然后我们使用 open() 方法来连接打开此数据库。一旦打开，就可以执行IndexedDB的操作了。
添加数据
使用idbi很容易向Object Store添加数据。下面的代码片段展示了如何使用 add() 方法向IDB数据库添加数据：
const data = {
name: 'John Doe',
age: 30,
};
myDatabase.add('MyStore', data).then(id => {
console.log(`Added successfully with ID ${id}`);
});上面的代码中，我们传递Object Store名称 MyStore，并向其添加了一个数据项 data。当数据成功添加后，我们在 then() 中收到一个唯一的ID，代表添加的数据项在对象存储中的位置。
读取数据
在IndexedDB中，我们可以读取全部数据，也可以根据特定的键值获取某一条数据。接下来，我们将展示如何使用 get() 和 getAll() 方法来读取数据。这些方法都返回Promise，所以你需要在 then() 中处理结果。
从Object Store中获得特定数据项
下面的代码片段展示了如何从Object Store中获得特定数据项：
myDatabase.get('MyStore', 1).then(data => {
console.log(`Data with ID ${data.id} is ${data.name}`);
});在这里，我们使用 get() 方法并传递ID，以获取Object Store中特定的数据项。当Promise解决时，我们将在 then() 中收到数据项的值。
从Object Store中获得全部数据
下面的代码片段展示了如何从Object Store中获取全部数据：
myDatabase.getAll('MyStore').then(data => {
console.log(`All data is ${JSON.stringify(data)}`);
});我们传递Object Store名称以调用 getAll() 方法。Promise解决时，我们将在 then() 中收到一个包含所有数据的数组。
更新数据
使用idbi可以轻松地更新Object Store中的数据项。下面的代码片段展示了如何使用 put() 来更新对象存储中的数据项：
-- -------------------- ---- ------- ----- ------- - - --- -- ----- ----- ----- ---- --- -- ------------------------- ---------------- -- - ----------------- ---- -- ------------- -- ---------- ---
在这里，我们使用了 put() 方法并传递对象，以更新Object Store中特定的数据项。
删除数据
最后，让我们看看如何使用idbi删除IDB数据库中的数据。下面的代码片段展示了如何使用 delete() 来删除数据项：
myDatabase.delete('MyStore', 1).then(() => {
console.log('Data deleted successfully');
});在这里，我们使用了 delete() 方法并传递ID，以删除Object Store中特定的数据项。
结论
在使用idbi后，我们可以发现它极大地简化了IndexedDB操作。无论是插入数据、读取数据、更新数据还是删除数据，它都提供了一组易于使用的API，使得在Web应用程序中使用IndexedDB成为一项容易且快速的任务。
希望本文对你有所帮助，如果你有任何问题或建议，欢迎在评论区留言。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600568d781e8991b448e4977