教程：如何在 ES12 中使用更好的 Promise.allSettled 函数？

什么是 Promise.allSettled 函数？

Promise.allSettled 函数是 ES2020 的新增特性，用于接受一个 Promise 数组，返回一个新的 Promise 数组，该 Promise 数组由原来数组中的所有 Promise 都被解决或被拒绝的结果组成，该结果以对象格式返回，包含原 Promise 数组中每个 Promise 的状态和结果。

Promise.all 同样也可以解决多个 Promise 的全部完成或全部拒绝的结果，但是它只返回第一个被拒绝的 Promise 的结果，如果其中有一个 Promise 被拒绝，那么整个 Promise.all 的结果就是 rejected。

如何使用 Promise.allSettled 函数？

Promise.allSettled 函数的使用和 Promise.all 函数很相似，我们需要传入一个 Promise 数组，然后返回一个新的 Promise 数组。Promise.allSettled 函数的返回值是一个由每个 Promise 结果构成的对象数组，每个对象都包含 status 和 value。

const promises = [
  Promise.resolve(1),
  Promise.reject("error"),
  Promise.resolve(3),
];

Promise.allSettled(promises).then((result) => {
  console.log(result);
});

// 输出结果
// [
//   { status: "fulfilled", value: 1 },
//   { status: "rejected", reason: "error" },
//   { status: "fulfilled", value: 3 },
// ]

通过这个例子，我们可以看到返回值的对象数组中包含了每个 Promise 的状态和结果。

Promise.allSettled 函数的好处

1. 不会因为某个 Promise 被拒绝而中断整个 Promise.allSettled 函数的执行；
2. 可以获得每个 Promise 的状态和结果，方便在后续处理中使用。

实际应用场景

我们可以通过使用 Promise.allSettled 函数来检测多个请求的状态，以此来确定一个应用程序的状态。

const fetchUsers = fetch("https://api.github.com/users");
const fetchPosts = fetch("https://api.github.com/posts");

Promise.allSettled([fetchUsers, fetchPosts]).then((results) => {
  const successfulRequests = results.filter(
    (result) => result.status === "fulfilled"
  );
  if (successfulRequests.length === 2) {
    console.log("Application is ready to use");
  } else {
    console.log("Application is not ready to use");
  }
});

以上示例展示了如何对多个 API 请求进行处理并在所有请求完成后检查它们的状态。

总结

Promise.allSettled 函数是一个很有用的特性，它与 Promise.all 函数不同，它不会因为某个 Promise 被拒绝而中断整个 Promise.allSettled 函数的执行。在实际开发中，我们可以使用 Promise.allSettled 函数来检测多个异步请求的状态，以此来确定一个应用程序的状态。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6595039deb4cecbf2d944f5d