在前端开发中，异步编程是常见的技术手段之一。而且，JavaScript 也提供了丰富的异步编程工具：回调函数、Promise、async/await 等等。但是，在实际应用中，我们还需要考虑诸如误报和异常处理等问题，这也是开发人员需要重点关注的地方。针对这些问题，ECMAScript 2019 标准中新增了 Promise.allSettled 方法。在本文中，我们将深入探讨 Promise.allSettled，包括其详细的使用方法、学习和指导意义，并提供示例代码来帮助读者更好地理解这个方法的用途和优点。
Promise.allSettled 的基本用法
Promise.allSettled 方法接收一个包含 Promise 实例的数组作为参数。该方法会在所有 Promise 都被“settled”（即 fulfilled 或 rejected）时才返回。返回值是包含所有 Promise 执行结果的对象数组，每个对象都包含以下两个属性：
- status：可能的取值为 "fulfilled" 或 "rejected"
- value（或 reason）：如果状态为 "fulfilled"，则是对应的 resolution 值；如果状态为 "rejected"，则是对应的 rejection 值
下面是一个简单的示例，展示了如何使用 Promise.allSettled 来获取多个异步操作的结果：
----- ---- - -------------------------- --------------------------
----- -------- - ------------ -- ------------
----------------------------
------------- -- -
---------------------- -- -
-- -------------- --- ------------ -
--------------------- ------ --- ------------------
- ---- -
------------------- ------ --- -------------------
-
---
---在这个示例中，我们使用 fetch 函数异步获取两个网址的内容，然后使用 Promise.allSettled 来等待两个异步操作都完成，最后遍历结果数组进行处理。如果操作成功，我们将会输出 "Success! Result is: "，并将内容结果（即 response 对象）打印出来；如果操作发生了错误，我们将会输出 "Error! Reason is: "，并将错误原因（即 rejection 值）打印出来。
在这个示例中，Promise.allSettled 明显比 Promise.all 更适合我们的需求。因为它不会在遇到错误时就立即停止，而是会等待所有操作都完成后再一起返回结果。
Promise.allSettled 中的误报处理
在实际使用中，我们需要注意到 Promise.allSettled 可能会引起“误报”问题。这是因为虽然 promise 已经被 rejected 了，但是我们还是要等待所有的 promise 完成，再统一返回结果。下面是一个简单的示例，演示了在使用 Promise.allSettled 时如何处理“误报”问题：
----- ---- - -
-------------------------
-------------------------
-------------------------
--
----- -------- - ------------ --
----------
-------------- -- ----------------
---------- -- -
-- ------------ --- -------- -
----- --- ---------- ------ ------------------
-
------ ------------
--
------------ -- --
------- --------
------- --------------
---
--
----------------------------------------- -- -
----- ---------- - -------
-------------- -- ------------- --- ------------
----------- -- --------------
----- ------ - --------------------- -- ------------- --- ------------
-------------------------- ------------
---------------------- --------
---在这个示例中，我们将 fetch 函数调用放在 Promise 构造函数中，并假设该函数最终会返回一个包含结果的 JSON 对象。如果其中某个操作出现了错误，我们就会将错误信息存储为原因并返回一个“失败”的 Promise。最终，我们使用 Promise.allSettled 来获取所有 Promise 执行的结果，过滤掉“失败”的 Promise，并将其全部打印出来。
Promise.allSettled 中的异常处理最佳解决方案
在上一节中，我们已经介绍了 Promise.allSettled 和误报处理。但是，在实际应用中，错误处理还需要更加细致和全面。下面我们将提供一些最佳实践，帮助开发人员更好地使用 Promise.allSettled，并避免出现意外的异常。
使用 finally 方法来处理清理逻辑
在 Promise.allSettled 完成后，我们通常需要处理一些“清理”逻辑，比如关闭网络请求、清理历史数据等等。为了避免重复的代码，我们可以使用 Promise.prototype.finally 方法来处理该类型逻辑。该方法接收一个回调函数（无论 Promise 是成功还是失败都会执行该函数），并返回一个新的 Promise。
比如，下面这个示例中，我们使用 Promise.allSettled 来处理两个异步操作。无论其中一个操作是否成功，我们都会在 Promise 完成时打印一条“Promise 执行完毕！”的消息：
----------------------------- ----------
------------- -- -
-- ------ -------
--
------------ -- -
-- ------ -----
--
----------- -- -
-------------------- --------
---使用 Promise.allSettled 的返回值来处理结果
在 Promise.allSettled 的返回值中，每个 Promise 的执行结果都会包含一个状态（成功或失败）和一个原因。因此，我们可以通过检查该结果来确定操作是否成功，然后执行相应的逻辑。
比如：
----------------------------- ----------------------- -- -
--- ------------ - --
--- ---------- - --
---------------------- -- -
-- -------------- --- ------------ -
---------------
- ---- -
-------------
-----------------------------
-
---
-- ----------- --- -- -
--------------------------------- ----
- ---- -
------------------------------- ----
-
---处理异常和错误
如果一个 promise 被 fulfilled 但出现了异常，那么它返回的结果就可能包含一个异常对象。在这种情况下，异常对象可以通过 result.value.propName 引用来获取。在使用时，需要特别注意处理这种异常，以避免在这种情况下出现更严重的问题。
另外，如果当前的 Promise.allSettled 中有多个异步操作，那么我们仍然需要注意异常的处理。例如，在 fetch 的错误处理中，我们可能需要添加额外的逻辑来确定具体是哪个操作出现了问题：
----------------------------- ----------
------------- -- -
---------------------- -- -
-- -------------- --- ------------ -
------------------------------------
- ---- -
-------------------------------------
-- ----
-- ------------- ---------- ---------- -
----------------------------------
-
-
---
--
------------ -- -
------------------------ -------
---结论
在本文中，我们深入讨论了 Promise.allSettled 方法，包括该方法的基本用法、误报和异常处理、以及最佳实践等。在实际应用中，我们需要敏锐地处理 Promise.allSettled 带来的可能性，同时必须遵循最佳实践来避免出现异常和错误。希望读者通过本文的学习，能更好地掌握 Promise.allSettled 的用法，提高异步编程的技能水平，为项目的开发和优化提供更有效的工具和思路。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/672c9a69ddd3a70eb6d8d379