indexedDB的奇妙世界：存取数据的灵活动态之旅

2024-01-01 14:12:20

indexedDB：非关系型数据库的利器

在前端开发的浩瀚世界中，我们经常需要保存数据以备后用。Cookie、localStorage 和 sessionStorage 固然不错，但它们的局限性显而易见。此时，indexedDB 闪亮登场，为我们提供了一种更灵活、更强大的数据存储解决方案。

indexedDB 的奥秘

indexedDB 是一款非关系型数据库，它采用键值对的方式存储数据。indexedDB 数据库分为两种类型：对象存储和索引。

对象存储： 对象存储是 indexedDB 的基本存储单元，可以容纳各种类型的数据，包括字符串、数字、布尔值、数组和对象。
索引： 索引是一种快速查找数据的结构，它能根据指定字段的值来定位数据。

indexedDB 的 API

indexedDB 提供了丰富的 API，让我们可以轻松操作数据库。主要包括：

open()： 打开数据库，如果数据库不存在则创建它。
close()： 关闭数据库。
put()： 向数据库中插入数据。
get()： 从数据库中获取数据。
delete()： 从数据库中删除数据。
clear()： 清空数据库。

indexedDB 的事务

事务是一种原子操作，它确保要么所有操作都成功，要么所有操作都失败。在 indexedDB 中，可以通过 transaction() 方法创建事务。

indexedDB 的索引

索引是用于快速查找数据的结构，它可以根据指定字段的值来检索数据。在 indexedDB 中，可以使用 createIndex() 方法创建索引。

indexedDB 的主键

主键是数据库中唯一标识一条记录的字段。在 indexedDB 中，可以使用 createObjectStore() 方法指定主键。

indexedDB 的示例

让我们通过一个示例来了解 indexedDB 的实际应用：

// 打开数据库
const request = indexedDB.open('my-database');

// 等待数据库打开
request.onsuccess = function(event) {
  const db = event.target.result;

  // 创建对象存储
  const objectStore = db.createObjectStore('customers', { keyPath: 'id' });

  // 创建索引
  objectStore.createIndex('name', 'name', { unique: false });

  // 向数据库中插入数据
  const customer = {
    id: 1,
    name: 'John Doe',
    email: 'john.doe@example.com'
  };
  objectStore.put(customer);

  // 从数据库中获取数据
  const request = objectStore.get(1);

  request.onsuccess = function(event) {
    const customer = event.target.result;
    console.log(customer);
  };

  // 关闭数据库
  db.close();
};