Promise之allSettled

📃一、前言

Promise.allSettled 是一个用于处理一组 Promise 的方法，它会等待所有的 Promise 被 settled（无论是解决还是拒绝），然后返回一个包含每个 Promise 结果的数组。这个方法解决了 Promise.all 存在的一个痛点：即是如若其中一个 Promise 被拒绝，Promise.all 就会立即返回一个被拒绝的 Promise，导致整个操作中断 有时候我们并不满意这样的结果 因此使用 ES2020 中提出的 allSettled 可以解决这个问题，并且下文中会给出相应的 Polyfill 确保能够支持 Promise.all 的场景下都能够顺利使用。

🎬二、一些关键点和应用场景包括：

🎀1、解决所有 Promise 结果：

Promise.allSettled 返回一个数组，包含每个 Promise 的结果对象，这些结果对象包含 status 属性，表示 Promise 的状态是 fulfilled 还是 rejected ，以及相应的值或原因。

🎀2、不中断整个操作：

与 Promise.all 不同，Promise.allSettled 不会因为其中一个 Promise 被拒绝而中断执行。即使有一些 Promise 被拒绝，其他 Promise 仍然会继续执行，而最终返回的结果是一个包含所有 Promise 结果的数组。

🎀3、处理并行异步任务：

在处理需要并行执行的异步任务时，有时你可能希望了解每个任务的最终状态，而不仅仅是得到一个被拒绝的结果就中断。这在需要收集多个异步任务的结果，而不希望因为其中一个失败而中断整个流程时非常有用。

🎀4、示例代码：

function allSettled (promises) {
  return Promise.all(
    promises.map(promise =>
      Promise.resolve(promise).then(
        value => ({
          status: 'fulfilled',
          value,
        }),
        reason => ({
          status: 'rejected',
          reason,
        })
      )
    )
  );
}

// 模拟三个promise方法，其中第二个一定会失败
const p1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(1);
  }, 100);
});
const p2 = new Promise((resolve, reject) => {
  reject('2 is error');
});
const p3 = Promise.resolve('3');

(async () => {
  try {
    // 使用Promise.all 只要有一个失败就会返回失败，成功的结果集不会返回, 此场景下后续的p3并不会执行
    const allPromiseResult = await Promise.all([p1, p2, p3])
    console.debug(allPromiseResult);
  } catch (err) {
    console.error(err);
  }
})();

(async () => {
  // 使用Promise.allSettled 会等待所有的promise执行完毕，不管成功还是失败，都会返回结果集，可以根据返回的状态来判断是否成功
  const allSettledResult = await allSettled([p1, p2, p3]);
  console.debug(allSettledResult);
  /* allSettledResult 返回 => [
    {
      "status": "fulfilled",
      "value": 1
    },
    {
      "status": "rejected",
      "reason": "2 is error"
    },
    {
      "status": "fulfilled",
      "value": "3"
    }
  ] */
})();

// 垫片 polyfill
if (!Promise.allSettled) {
  Promise.allSettled = allSettled;
}

(async () => {
  // 使用 Promise.allSettled
  const allSettledResult = await Promise.allSettled([p1, p2, p3])
  console.debug(allSettledResult);
})();

在上述示例中，无论每个 Promise 是否被解决，都会输出相应的状态和值或原因。这种行为对于需要收集异步任务结果且不希望中断整个操作的情况非常有用。

🎀5、示例代码图片：

可以保存代码图片到本地。

---

❤ enjoy it.