构建协调并行的 Promise.allSettled

2023-12-08 14:28:07

了解 Promise.all 和 Promise.allSettled：异步 JavaScript 的利器

在现代 JavaScript 开发中，Promise 已成为处理异步代码的基石。Promise 使我们能够以更简洁、更可读的方式编写代码，而不必使用繁琐的回调函数。

Promise.all 是一个强大的工具，它允许我们等待一组 Promise 都完成。这对于并行执行多个异步任务非常有用。但是，Promise.all 有一个缺点：它不会告诉我们哪个 Promise 被拒绝了。

ES2020 引入了 Promise.allSettled 方法来解决这个问题。Promise.allSettled 返回一个包含所有传入 Promise 结果的数组，无论它们是成功完成还是被拒绝。这使得我们可以轻松地处理并行任务，并获取每个任务的状态和结果。

Promise.all

Promise.all 接收一个由 Promise 组成的数组，并返回一个 Promise。这个 Promise 在所有传入的 Promise 都完成或有一个 Promise 被拒绝时才完成。

如果所有传入的 Promise 都成功完成，那么 Promise.all 返回的 Promise 将被解析，其值为一个包含所有传入 Promise 结果的数组。如果至少有一个传入的 Promise 被拒绝，那么 Promise.all 返回的 Promise 将被拒绝，其值为第一个被拒绝的 Promise 的拒绝原因。

代码示例：

const promises = [
  fetch('https://example.com/api/users'),
  fetch('https://example.com/api/posts'),
  fetch('https://example.com/api/comments')
];

Promise.all(promises)
  .then(responses => {
    // 所有请求都完成
  })
  .catch(error => {
    // 至少有一个请求被拒绝
  });

Promise.allSettled

Promise.allSettled 的用法与 Promise.all 类似，但是它返回一个包含所有传入 Promise 结果的数组，无论这些 Promise 是成功完成还是被拒绝。

Promise.allSettled 返回的数组中的每个元素都是一个对象，这个对象包含两个属性：status 和 value。status 属性的值为 "fulfilled" 或 "rejected"，表示该 Promise 是成功完成还是被拒绝。value属性的值为该Promise` 的结果或拒绝原因。

代码示例：

const promises = [
  fetch('https://example.com/api/users'),
  fetch('https://example.com/api/posts'),
  fetch('https://example.com/api/comments')
];

Promise.allSettled(promises)
  .then(results => {
    for (const result of results) {
      if (result.status === "fulfilled") {
        // 该 Promise 成功完成
        console.log(result.value);
      } else {
        // 该 Promise 被拒绝
        console.error(result.reason);
      }
    }
  });