随着前端开发中异步操作越来越普遍，Promise 成为我们处理异步操作的重要工具。在 ECMAScript 2021 (ES12) 中，Promise 新增了一个非常方便的 API —— Promise.allSettled，可以轻松地对多个异步操作进行统一处理。
Promise.allSettled 的作用
Promise.allSettled 方法接收一个 Promise 对象数组作为参数，返回一个新的 Promise 对象。该 Promise 对象在所有传入的 Promise 对象都完成（fulfilled 或者 rejected）时，才会返回最终结果。与 Promise.all 方法不同的是，Promise.allSettled 方法并不在任何一个 Promise 对象被 rejected 时立即返回，而是等到所有 Promise 对象都完成后才返回。因此，Promise.allSettled 方法返回的 Promise 对象一定是 fulfilled 的。
Promise.allSettled 方法返回的结果是一个对象数组，数组中的每个对象都包含了一个 Promise 对象结果的状态和结果值。
const promise1 = Promise.resolve(1);
const promise2 = Promise.reject(new Error('Rejected'));
const promise3 = Promise.resolve('Hello World');
Promise.allSettled([promise1, promise2, promise3]).then(results => {
console.log(results);
});上面的代码中，promise2 被 reject，但 Promise.allSettled 仍然返回一个包含三个对象的数组，对象分别包含了 Promise 对象的状态和结果值。
[
{ status: 'fulfilled', value: 1 },
{ status: 'rejected', reason: Error: Rejected at <anonymous>:3:36 },
{ status: 'fulfilled', value: 'Hello World' }
]Promise.allSettled 实战
我们可以利用 Promise.allSettled 方法来优化异步操作，比如在处理多个 API 请求时，我们希望等所有请求都返回后再对数据进行处理，而不是一个一个地等待他们完成。
假设我们有三个 API 请求：getUser、getOrders 和 getComments。我们需要等待所有请求都返回数据后再进行数据处理。
-- -------------------- ---- -------
----- ------- - -- -- -
------ --- ----------------- ------- -- -
------------- -- -
--------- --- --- ----- ------ ---
-- ------
---
--
----- --------- - ------ -- -
------ --- ----------------- ------- -- -
------------- -- -
------------------ --------- -----------
-- ------
---
--
----- ----------- - ------ -- -
------ --- ----------------- ------- -- -
------------- -- -
-------------------- ----------- -------------
-- ------
---
--我们现在可以使用 Promise.allSettled 来等待所有请求的结果。在所有请求都完成后，我们可以对数据进行处理。
-- -------------------- ---- ------- ----- ------ - -- ------------------------------------ ------------------ ---------------------------------- -- - ----- ---- - ----------------- ----- ------ - ----------------- ----- -------- - ----------------- ----------------- ------- ---------- ---
上面的代码中，我们把 getUser、getOrders 和 getComments 三个 Promise 对象放入 Promise.allSettled 中。当所有 Promise 对象都完成后，Promise.allSettled 返回一个包含三个 Promise 对象的结果状态和值的数组。然后我们可以从数组中取出每个 Promise 对象的结果值，继续进行数据处理。
总结
Promise.allSettled 方法是 ECMAScript 2021 (ES12) 新增的一个非常实用的方法，在处理多个异步操作时可以提供更好的体验和性能优化。同时，它也是我们学习 Promise 的必备知识点之一。
动手尝试一下，体验一下 Promise.allSettled 带来的便利吧！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64ca306f5ad90b6d041a03dc