实用方法：从chrome.storage.local加载多个浏览器本地设置

你可以重构一个更简洁的loadLocalStorage函数，直接满足你的需求——键不存在时返回null，调用方式极简：

单键读取实现 #

const loadLocalStorage = async (key) => {
  return new Promise(resolve => {
    chrome.storage.local.get([key], result => {
      const value = result[key];
      // 只保留布尔值，非布尔/不存在的情况返回null（可根据需求移除该判断）
      resolve(typeof value === 'boolean' ? value : null);
    });
  });
};

使用示例 #

注意异步函数必须在async上下文里用await调用：

async function loadAppSettings() {
  const selfDiscard = await loadLocalStorage('settingsSelfDiscard');
  const compactToolbar = await loadLocalStorage('settingsCompactToolbar');
  
  // 这里可以直接使用读取到的设置
  if (selfDiscard) {
    // 执行自动丢弃逻辑
  }
}

// 启动加载
loadAppSettings();

更高效的批量读取 #

如果要读取多个设置，推荐一次请求批量获取，减少异步调用次数：

const loadLocalStorageBatch = async (keys) => {
  return new Promise(resolve => {
    chrome.storage.local.get(keys, results => {
      const output = {};
      keys.forEach(key => {
        const val = results[key];
        output[key] = typeof val === 'boolean' ? val : null;
      });
      resolve(output);
    });
  });
};

批量读取示例 #

async function loadAppSettings() {
  const { settingsSelfDiscard: selfDiscard, settingsCompactToolbar: compactToolbar } = 
    await loadLocalStorageBatch(['settingsSelfDiscard', 'settingsCompactToolbar']);
  
  // 使用设置
}

核心调整说明 #

• 去掉了原代码中的reject逻辑，直接返回null表示键不存在或值无效，避免了重复的.catch代码
• 内置了布尔值校验，确保返回的是符合预期的设置值（如果不需要校验，直接改成resolve(value ?? null)即可）
• 批量读取版本大幅减少了异步请求次数，更适合多设置场景

内容的提问来源于stack exchange，提问作者FMaz008