使用promise将回调方式变为同步等待方式
应用场景:需同步获取值的时候,回调方式使用起来比较难受,并且库里内并未提供同步api,此时可使用promise+await将回调方式改为同步执行,
核心:promise+await将回调改为同步调用
const result = await new Promise((resolve, reject) => {
request.onsuccess = () => resolve(request.result);
request.onerror = () => reject(false);
});
原始代码:
// 通用方法 - 获取数据
export async function getCache(key) {
const database = await initDB();
return new Promise((resolve, reject) => {
const tx = database.transaction('apiCache', 'readonly');
const store = tx.objectStore('apiCache');
const request = store.get(key);
request.onsuccess = () => {
const result = request.result;
if (!result) {
resolve(null); // 数据不存在
return;
}
// 检查数据是否过期
if (result.expiry < Date.now()) {
deleteCache(key); // 删除过期数据
resolve(null);
} else {
resolve(result.data);
}
};
request.onerror = () => {
reject(request.error); // 处理错误
};
});
}
优化后的代码:
// 通用方法 - 获取数据
export async function getCache(key) {
const database = await initDB();
const tx = database.transaction('apiCache', 'readonly');
const store = tx.objectStore('apiCache');
const request = await store.get(key);
// 将 IndexedDB 请求封装为 Promise
const result = await new Promise((resolve, reject) => {
request.onsuccess = () => resolve(request.result);
request.onerror = () => reject(false);
});
if (!result) {
return null;
}
// 检查数据是否过期
if (result.expiry < Date.now()) {
await deleteCache(key); // 删除过期数据
return null;
}
return result.data;
}

浙公网安备 33010602011771号