如何在 ES11 中使用 Promise.allSettled 方法处理 Promise 数组-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，我们经常需要处理 Promise 数组，以便在所有 Promise 都完成后执行某些操作。ES6 中引入了 Promise.all 方法来实现这个功能，但它只有在所有 Promise 都成功时才会返回结果，如果其中有一个 Promise 失败了就会直接抛出错误。ES11 中新增了 Promise.allSettled 方法来处理这个问题，本文将详细介绍如何在 ES11 中使用 Promise.allSettled 方法处理 Promise 数组。

Promise.allSettled 方法简介

Promise.allSettled 方法接收一个 Promise 数组作为参数，并返回一个 Promise，它在所有 Promise 都完成后才会返回结果，无论 Promise 成功或失败。返回的 Promise 的状态是 fulfilled，它的值是一个数组，数组中的每个元素都是一个对象，该对象表示对应的 Promise 的执行结果，包含以下两个属性：

status：表示 Promise 的状态，可能的值为 "fulfilled" 或 "rejected"。
value 或 reason：如果 Promise 成功，该属性表示 Promise 的返回值；如果 Promise 失败，该属性表示 Promise 的错误原因。

Promise.allSettled 方法的使用

下面是 Promise.allSettled 方法的基本使用示例：

// javascriptcn.com 代码示例
const promises = [
  Promise.resolve(1),
  Promise.reject(new Error('error')),
  Promise.resolve(3)
];

Promise.allSettled(promises)
  .then(results => {
    console.log(results);
  })
  .catch(error => {
    console.error(error);
  });

运行上面的代码，输出结果如下：

[
  { status: 'fulfilled', value: 1 },
  { status: 'rejected', reason: Error: error at <anonymous>:3:21 },
  { status: 'fulfilled', value: 3 }
]

上面的代码中，我们创建了一个包含三个 Promise 的数组，其中第二个 Promise 是一个失败的 Promise。通过调用 Promise.allSettled 方法并传入这个数组，我们可以得到一个包含三个对象的数组，每个对象表示对应的 Promise 的执行结果。

Promise.allSettled 方法的应用

使用 Promise.allSettled 方法，我们可以更方便地处理 Promise 数组。例如，我们可以在所有 Promise 都完成后统计它们的执行结果，而不必担心其中有一个 Promise 失败导致整个过程中断。下面是一个示例，它演示了如何使用 Promise.allSettled 方法统计多个异步请求的执行结果：

// javascriptcn.com 代码示例
const urls = [
  'https://api.github.com/users/defunkt',
  'https://api.github.com/users/pjhyett',
  'https://api.github.com/users/wycats'
];

const requests = urls.map(url => fetch(url));

Promise.allSettled(requests)
  .then(results => {
    const successfulResults = results.filter(result => result.status === 'fulfilled').map(result => result.value);
    const failedResults = results.filter(result => result.status === 'rejected').map(result => result.reason);
    console.log('Successful results:', successfulResults);
    console.log('Failed results:', failedResults);
  })
  .catch(error => {
    console.error(error);
  });

上面的代码中，我们首先定义了一个包含多个 URL 的数组，然后使用数组的 map 方法将每个 URL 转换成一个 Promise，最后将这些 Promise 传递给 Promise.allSettled 方法。在 Promise.allSettled 方法的回调函数中，我们通过过滤数组来分别获取成功和失败的结果，并将它们输出到控制台。

总结

在 ES11 中，我们可以使用 Promise.allSettled 方法更方便地处理 Promise 数组，无论其中有多少个 Promise 成功或失败。使用 Promise.allSettled 方法，我们可以更轻松地处理异步请求的结果，提高代码的可读性和可维护性。希望本文能够帮助你更好地理解 Promise.allSettled 方法的使用和应用。

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