如何将Promise的then/catch链式调用转换为async/await？

现有一段通过Promise链式调用处理任务队列的代码，每个任务包含onFulfilled和onRejected回调：

const chain = [
    {
        onFulfilled: () => {/*some logic*/},
        onRejected: () => {/*some logic*/},
    },
    {
        onFulfilled: () => {/*some logic*/},
        onRejected: () => {/*some logic*/},
    },
    {
        onFulfilled: () => {/*some logic*/},
        onRejected: () => {/*some logic*/},
    },
    //...
];
const data = 'initial data';
let promise = Promise.resolve(data);
let i = 0;
while (i < chain.length) {
    promise = promise.then(chain[i].onFulfilled).catch(chain[i].onRejected);
    i++;
}

这段代码等价于连续的.then().catch链式调用，每个回调的结果会传递给下一个任务。

尝试转换为async/await写法时，写出了以下代码：

let data = 'initial data';
for (const fn of chain) {
  try {
      data = await fn.onFulfilled(data);
  } catch (e) {
      data = await fn.onRejected(e);
  }
}

但存在问题：如果某个任务的onRejected抛出错误，会直接终止for循环，无法被后续任务的onRejected处理，这和原Promise链式的行为不一致。

要完全复刻原Promise链式的行为，需要保证每一轮执行的结果（无论成功还是失败）都能流转到下一轮任务。这里提供两种可行的写法：

写法一：嵌套try/catch捕获所有可能的错误 #

通过在onRejected的执行外层再添加一层try/catch，捕获它抛出的错误并作为下一轮的输入：

let data = 'initial data';
for (const fn of chain) {
  try {
    data = await fn.onFulfilled(data);
  } catch (e) {
    try {
      data = await fn.onRejected(e);
    } catch (rejectedErr) {
      // 将onRejected抛出的错误作为下一轮的输入
      data = rejectedErr;
    }
  }
}

写法二：保留Promise链式核心逻辑 #

这种写法直接沿用原代码的Promise链式逻辑，仅改用for...of遍历任务队列，逻辑和原代码完全一致，同时可结合async/await获取最终结果：

let promise = Promise.resolve('initial data');
for (const { onFulfilled, onRejected } of chain) {
  promise = promise.then(onFulfilled).catch(onRejected);
}
// 若需要获取最终结果，使用await
const finalData = await promise;

问题根源说明 #

原Promise链式中，.catch()会返回一个新Promise：如果onRejected抛出错误，这个Promise会变为rejected状态，但下一个.then().catch()会捕获该状态并继续执行。而最初的async/await写法中，onRejected抛出的错误会直接跳出当前try/catch，若没有外层捕获则终止循环，破坏了原有的错误流转逻辑。修改后的写法要么显式捕获onRejected的错误，要么通过Promise链式自动维护错误流转，确保每一步的结果都能传递到下一个任务。

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