为何Promise的then方法提前执行？如何修复非new Promise写法问题

你碰到的这个问题其实是Promise链式调用里很常见的误区——错误处理了异步函数的返回值，咱们一步步拆解清楚：

为什么第一个版本的getTabParamsFromStorage不工作？ #

核心问题出在函数的返回值逻辑上：

• 第一个版本里，你在chrome.storage.local.get的匿名回调函数里写了return Promise.resolve(items[tabId])，但这个返回值只属于那个回调函数本身，getTabParamsFromStorage函数没有任何顶层的return语句，所以它默认返回undefined。
• 当你在第一个then块里执行return getTabParamsFromStorage(tabId)时，相当于返回了undefined。根据Promise链式调用规则：如果then的回调返回非Promise值，会自动把它包装成一个已resolved的Promise，所以第二个then会立刻执行，拿到的params自然就是undefined。
• 而能正常工作的第二个版本，getTabParamsFromStorage直接返回了一个新创建的Promise对象，并且在chrome.storage.local.get的回调里调用resolve(items[tabId])传递异步结果，这样链式调用就能正确等待异步操作完成，再执行下一个then块。

如何修改第一个版本让它正常工作？ #

本质上你需要把基于回调的chrome.storage.local.get包装成Promise，因为回调的返回值无法被外部函数捕获。如果非要用Promise.resolve，可以这么写（虽然有点多此一举）：

// 修正后的版本（使用Promise.resolve）
function getTabParamsFromStorage(tabId) {
  return new Promise((resolve) => {
    chrome.storage.local.get(tabId, items => {
      console.log('a', items[tabId]);
      // 用Promise.resolve包裹后传给resolve也可行，但直接传值更简洁
      resolve(Promise.resolve(items[tabId]));
    });
  });
}

不过更简洁、符合Promise最佳实践的写法还是你第二个版本的实现——直接用new Promise包装异步回调，在回调里调用resolve传递结果，这是处理浏览器回调式异步API的标准方式。

总结一下：对于这类基于回调的异步API，必须用new Promise包装，才能让它融入Promise链式调用体系，否则外部函数无法捕获回调里的异步结果。

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