返回
简明扼要的介绍IndexedDB的Promise封装
前端
2024-01-11 03:18:41
IndexedDB的Promise封装简介
IndexedDB是一种非关系型数据库,它与传统的关系型数据库存在着明显的差异。在实际的应用场景中,我对IndexedDB进行了Promise二次封装,以便更好地满足日常开发的需求。
IndexedDB的Promise封装代码实现
以下是我对IndexedDB的Promise封装的代码实现:
// 打开数据库
const openDB = (dbName, version) => {
return new Promise((resolve, reject) => {
const request = indexedDB.open(dbName, version);
request.onsuccess = (event) => {
resolve(event.target.result);
};
request.onerror = (event) => {
reject(event.target.error);
};
request.onupgradeneeded = (event) => {
const db = event.target.result;
// 在这里创建表和索引
};
});
};
// 关闭数据库
const closeDB = (db) => {
db.close();
};
// 添加数据
const addData = (db, storeName, data) => {
return new Promise((resolve, reject) => {
const transaction = db.transaction(storeName, 'readwrite');
const store = transaction.objectStore(storeName);
const request = store.add(data);
request.onsuccess = (event) => {
resolve(event.target.result);
};
request.onerror = (event) => {
reject(event.target.error);
};
});
};
// 获取数据
const getData = (db, storeName, key) => {
return new Promise((resolve, reject) => {
const transaction = db.transaction(storeName, 'readonly');
const store = transaction.objectStore(storeName);
const request = store.get(key);
request.onsuccess = (event) => {
resolve(event.target.result);
};
request.onerror = (event) => {
reject(event.target.error);
};
});
};
// 更新数据
const updateData = (db, storeName, data) => {
return new Promise((resolve, reject) => {
const transaction = db.transaction(storeName, 'readwrite');
const store = transaction.objectStore(storeName);
const request = store.put(data);
request.onsuccess = (event) => {
resolve(event.target.result);
};
request.onerror = (event) => {
reject(event.target.error);
};
});
};
// 删除数据
const deleteData = (db, storeName, key) => {
return new Promise((resolve, reject) => {
const transaction = db.transaction(storeName, 'readwrite');
const store = transaction.objectStore(storeName);
const request = store.delete(key);
request.onsuccess = (event) => {
resolve(event.target.result);
};
request.onerror = (event) => {
reject(event.target.error);
};
});
};
IndexedDB的Promise封装使用示例
以下是IndexedDB的Promise封装的使用示例:
// 打开数据库
const db = await openDB('myDB', 1);
// 添加数据
const data = {
name: 'John Doe',
age: 30
};
await addData(db, 'users', data);
// 获取数据
const result = await getData(db, 'users', 1);
console.log(result);
// 更新数据
data.age = 31;
await updateData(db, 'users', data);
// 删除数据
await deleteData(db, 'users', 1);
// 关闭数据库
await closeDB(db);
IndexedDB的Promise封装的优势
对IndexedDB进行Promise二次封装具有以下优势:
- 简化了IndexedDB的API,使用起来更加方便。
- 提高了IndexedDB的性能,因为Promise可以并行执行。
- 增强了IndexedDB的可靠性,因为Promise可以捕获错误并进行处理。
结语
总之,对IndexedDB进行Promise二次封装是一个非常有用的技巧,它可以简化IndexedDB的API,提高性能,增强可靠性,从而使IndexedDB在Web开发中更加好用。