随着前端工程越来越复杂，异步调用也变得越来越常见。但是，有时我们需要在一个函数中一次性调用多个异步函数，这时候就会出现多重响应的问题。例如，当我们同时调用两个异步函数时，如果其中一个函数返回失败，整个代码都会中断执行，并且我么不知道哪个函数失败了。为了解决这个问题，我们可以使用 ECMAScript 2020 中引入的 Promise.allSettled 方法。
什么是 Promise.allSettled？
Promise.allSettled 是一个全局方法，它接受一个 Promise 数组作为参数，并返回一个新的 Promise。这个新的 Promise 首先会等待所有传递进来的 Promise 被执行完毕，不管状态是成功还是失败，然后返回一个数组，包含每个 Promise 对象执行的结果。每一个结果都是一个对象，包含以下两个属性：
- status：状态，有两个可能的值：“fulfilled” 表示成功，“rejected” 表示失败。
- value/reason：执行结果，如果是成功状态，则是执行的结果值，如果是失败状态，则是一个包含错误信息的原因对象。
Promise.allSettled 示例
下面是一个简单的例子，演示如何同时处理多个异步函数的返回值：
-- -------------------- ---- ------- ----- -------- - ------------------- ----- -------- - --- ----------------- ------- -- ------------------ ---- ----------- ----------------------------- ---------- ------------- -- ---------------------- -- ------- -- - -- - ------- ------------ ------ - -- -- - ------- ----------- ------- -------- - -- -
在上面的例子中，我们定义了两个 Promise，promise1 和 promise2。promise1 是一个Resolved 状态的 Promise，因此它会在立即被解决并返回1。promise2 是一个Rejected 状态的 Promise，它会在100毫秒后被拒绝，并返回一个错误信息 'Error!'。
我们将这两个 Promise 传递给 Promise.allSettled 方法，然后使用 then() 方法获取结果。得到的结果是一个包含两个对象的数组，第一个对象表示 Promise1 的执行结果，第二个对象则表示 Promise2 的执行结果。
Promise.allSettled 详解
在实际应用中，我们可以将多个异步函数的 Promise 对象放进一个数组中，然后使用 Promise.allSettled 方法来处理它们的返回结果。这样做有助于我们处理一组任务的返回值。
当我们使用 Promise.allSettled 时，我们可以得到一个包含所有 Promise 对象的执行结果的数组。如果每个 Promise 对象都是成功状态，那么这个数组只会包含执行成功的结果。如果其中任何一个 Promise 对象是拒绝状态，那么这个数组将包含所有 Promise 对象的执行结果，不管它们是否成功。
下面是一个更实际的例子。
-- -------------------- ---- -------
-------- -------- -
------ --- --------------- -- ------------------- ----- ------- -----
-
-------- -------- -
------ --- ----------- ------- -- ------------------ ----- ------ -----
-
-------- -------- -
------ --- --------------- -- ------------------- ----- ------- -----
-
----------------------------- --------- ----------
------------- -- -
---------------------- -- -
-- -------------- --- ------------ -
----------------------- ------------------
- ---- -
---------------------- -------------------
-
---
---在这个例子中，我们定义了三个异步函数 async1、async2 和 async3。async1 和 async3 都会成功地返回一个结果，而 async2 则会失败。
我们将这三个函数的 Promise 对象传递给 Promise.allSettled 方法，然后使用 then 方法获取其结果。得到的结果是一个包含三个对象的数组，第一个对象表示 async1 的执行结果，第二个对象表示 async2 的执行结果，第三个对象表示 async3 的执行结果。
在then中，我们使用 forEach() 方法遍历结果数组，并根据结果中的 status 属性判断每个 Promise 对象的执行状态。如果状态是 "fulfilled"，则表示这个 Promise 对象执行成功，我们就输出它的执行结果。如果状态是 "rejected"，则表示这个 Promise 对象执行失败，我们就输出错误信息。
总结
Promise.allSettled 是 ECMAScript 2020 中引入的处理异步调用的全局方法之一。它可以方便地处理多个异步函数的返回值，并返回一个包含所有 Promise 对象的执行结果的数组，无论这些 Promise 对象执行成功还是失败。
使用Promise.allSettled，可以使异步代码更加简洁易懂，从而提高编写代码的效率，同时可以提高代码的可维护性和健壮性。
我们应该充分利用Promise.allSettled这个工具，从而实现更加高效的异步操作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64ad229748841e989494ad8f