封装一个indexedDB的增删改存的库

封装一个 IndexedDB 库可以帮助你简化在前端开发中处理 IndexedDB 的复杂性。以下是一个简单的 IndexedDB 封装库示例，包含增、删、改、查的基本功能：

class IndexedDBHelper {
  constructor(dbName, storeName, version = 1) {
    this.dbName = dbName;
    this.storeName = storeName;
    this.version = version;
    this.db = null;
  }

  async init() {
    return new Promise((resolve, reject) => {
      const request = indexedDB.open(this.dbName, this.version);

      request.onerror = (event) => {
        reject(event.target.error);
      };

      request.onsuccess = (event) => {
        this.db = event.target.result;
        resolve();
      };

      request.onupgradeneeded = (event) => {
        const db = event.target.result;
        if (!db.objectStoreNames.contains(this.storeName)) {
          db.createObjectStore(this.storeName, { keyPath: 'id', autoIncrement: true });
        }
      };
    });
  }

  async add(data) {
    return new Promise((resolve, reject) => {
      const transaction = this.db.transaction([this.storeName], 'readwrite');
      const store = transaction.objectStore(this.storeName);
      const request = store.add(data);

      request.onsuccess = () => {
        resolve(request.result);
      };

      request.onerror = () => {
        reject(request.error);
      };
    });
  }

  async get(id) {
    return new Promise((resolve, reject) => {
      const transaction = this.db.transaction([this.storeName], 'readonly');
      const store = transaction.objectStore(this.storeName);
      const request = store.get(id);

      request.onsuccess = () => {
        resolve(request.result);
      };

      request.onerror = () => {
        reject(request.error);
      };
    });
  }

  async update(id, data) {
    return new Promise((resolve, reject) => {
      const transaction = this.db.transaction([this.storeName], 'readwrite');
      const store = transaction.objectStore(this.storeName);
      const request = store.put({ ...data, id: id });

      request.onsuccess = () => {
        resolve(request.result);
      };

      request.onerror = () => {
        reject(request.error);
      };
    });
  }

  async delete(id) {
    return new Promise((resolve, reject) => {
      const transaction = this.db.transaction([this.storeName], 'readwrite');
      const store = transaction.objectStore(this.storeName);
      const request = store.delete(id);

      request.onsuccess = () => {
        resolve();
      };

      request.onerror = () => {
        reject(request.error);
      };
    });
  }

  async close() {
    if (this.db) {
      this.db.close();
    }
  }
}

使用示例：

const dbHelper = new IndexedDBHelper('myDatabase', 'myStore');

// 初始化数据库和存储对象
await dbHelper.init();

// 添加数据
await dbHelper.add({ name: 'John', age: 30 });
await dbHelper.add({ name: 'Jane', age: 25 });

// 获取数据
const data = await dbHelper.get(1); // 获取 id 为 1 的数据
console.log(data); // 输出：{ id: 1, name: 'John', age: 30 }

// 更新数据
await dbHelper.update(1, { name: 'Jonathan', age: 31 }); // 更新 id 为 1 的数据
const updatedData = await dbHelper.get(1); // 获取更新后的数据
console.log(updatedData); // 输出：{ id: 1, name: 'Jonathan', age: 31 }

// 删除数据
await dbHelper.delete(1); // 删除 id 为 1 的数据
const deletedData = await dbHelper.get(1); // 尝试获取已删除的数据，将返回 undefined 或 null（具体取决于浏览器实现）
console.log(deletedData); // 输出：undefined 或 null

// 关闭数据库连接（可选，通常在不再需要数据库时调用）
await dbHelper.close();