Promise.all 和 Promise.allSettled 的区别及应用场景-JavaScript中文网-JavaScript教程资源分享门户

Promise.all 和 Promise.allSettled 的区别及应用场景

Promise 是 JavaScript 中异步编程的重要部分，而 Promise.all 和 Promise.allSettled 这两个方法则是在处理多个 Promise 并行时非常实用的方法。然而，这两个方法有明显的差异，需要根据实际情况进行选择使用。

Promise.all 的用法

首先，我们来看下 Promise.all 的用法。Promise.all 接受一个 Promise 对象数组作为参数，并在所有 Promise 都成功处理后执行回调函数。

const p1 = Promise.resolve(1);
const p2 = Promise.resolve(2);
const p3 = Promise.resolve(3);

Promise.all([p1, p2, p3]).then(result => {
  console.log(result); // [1, 2, 3]
});

上面的代码中，我们创建了三个 Promise 对象，并使用 Promise.all 将它们一起处理。当所有 Promise 对象都成功处理后，我们打印出了它们的值。如果有任何一个 Promise 失败，Promise.all 就会终止并返回失败的信息。

Promise.allSettled 的用法

与 Promise.all 不同，Promise.allSettled 不会因为其中任何一个 Promise 失败而终止其它 Promise 的处理。相反，它会等待所有 Promise 处理完成后返回一个包含每个 Promise 回调信息的数组。

// www.javascriptcn.com code example
const p1 = Promise.resolve(1);
const p2 = Promise.reject(2);
const p3 = Promise.resolve(3);

Promise.allSettled([p1, p2, p3]).then(results => {
  console.log(results);
  // [
  //   { status: 'fulfilled', value: 1 },
  //   { status: 'rejected', reason: 2 },
  //   { status: 'fulfilled', value: 3 }
  // ]
});

上述代码中，我们创建了一个数组，包含了三个 Promise 对象。其中 p2 是一个拒绝的 Promise。当我们使用 Promise.allSettled 时，它返回的是一个包含三个对象的数组，它们描述了每个 Promise 的结果，包括该 Promise 是否成功。

Promise.all 和 Promise.allSettled 的应用场景

Promise.all 和 Promise.allSettled 都是并行处理 Promise 的有用工具。不过，它们在不同的场景下可能具有不同的变体。

Promise.all：如果您希望在多个 Promise 都成功时处理结果，您应该使用 Promise.all。例如，如果您正在处理一个应用中的多个 API 请求，那么您可能只需要在所有这些请求都成功处理时执行一些操作。
Promise.allSettled：如果您希望处理所有 Promise 的回调信息（无论是成功还是失败），那么您可以使用 Promise.allSettled。例如，如果您想获取多个 API 请求的所有结果，并将它们放在一个数组中，这就是一个完美的场景。

示例代码

我们来看一下如何在上面的例子中使用 Promise.all 和 Promise.allSettled：

// www.javascriptcn.com code example
// Promises
const p1 = Promise.resolve(1);
const p2 = Promise.reject(2);
const p3 = Promise.resolve(3);

// Promise.all usage
Promise.all([p1, p2, p3]).then(results => {
  console.log(results);
  // won't be executed
}).catch(error => {
  console.error(error); // 2
});

// Promise.allSettled usage
Promise.allSettled([p1, p2, p3]).then(results => {
  console.log(results);
  // [
  //   { status: 'fulfilled', value: 1 },
  //   { status: 'rejected', reason: 2 },
  //   { status: 'fulfilled', value: 3 }
  // ]
});

上述代码中，我们使用了三个 Promise 对象，并分别进行了处理。使用 Promise.all，我们处理了这三个 Promises 并在其中有任何一个 Promise 拒绝时捕获了错误。

在另一方面，我们还使用了 Promise.allSettled 处理数组。由于 p2 被拒绝，我们也捕获了这个拒绝的 Promise。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/67cfe7b2e46428fe9ec30725

Promise.all 和 Promise.allSettled 的区别及应用场景