ES2020 是 ECMAScript 标准的最新版本，其中新增的 Promise.allSettled 方法得到了广泛关注和使用。本文将详细介绍该方法的使用，以及它带来的好处，最后提供示例代码。
Promise.allSettled
Promise.allSettled 方法接受一个由 Promise 实例组成的数组作为参数，返回一个新的 Promise 实例。当这个参数中所有的 Promise 都已经 settle（即成功/失败）时，该新的 Promise 实例会 resolve ，并返回一个由对象组成的数组，该数组中的每个对象表示原先的 Promise 实例的最终状态。
每个对象都应该包含如下两个字段：
status，表示 Promise 是成功("fulfilled")还是失败("rejected")。value(status="fulfilled") 或reason(status="rejected")，表示 Promise 最终结果。
在返回的数组中，结果与 Promise 的参数数组中的顺序相同。
----- -------- - ------------------- ----- -------- - ------------------ ---------------- ----- -------- - ------------------------ ----------------------------- --------- ---------- ------------- -- ---------------------- -- ----- - - ------- ------------ ------ - -- - ------- ----------- ------- ------ ----- -- - ------- ------------ ------ ------ - - --
Promise.allSettled 的好处
Promise.all 方法是一种流行的并发控制机制，它接受一个 Promise 对象数组作为参数，返回一个新的 Promise 对象，该 Promise 对象在数组中所有的 Promise 对象都被处理完毕后才会被 resolved。如果其中一个 Promise 对象 rejected，则该新的 Promise 对象也会直接 rejected。
然而，Promise.all 方法仅仅在所有 Promise 对象成功完成的情况下才能正常工作。在某些情况下，Promise.all 的行为不是你所希望的。
比如，当需要在一个数组中的所有请求都处理完毕后才更新界面上的内容时，在数组中有些请求可能错误，因而使用 Promise.all 会使得所有请求都失败，这可能导致严重问题。在这种情况下，使用 Promise.allSettled 能够解决这个问题。
示例代码
下面是一个示例，当三个请求都处理完毕后才会更新界面上的内容，无论它们是否成功：
----- -------- -------------- -
----- -------- - ----- -----------
------ ----------------
-
----- ---- - --------------------------------- -------------------------------- ------------------------------------
---------------------------------------
------------- -- -
----- ---- - -------------------- ------- -- -
-- -------------- --- ------------ -
------ -------------------------
-
------ ----
-- ----
-----------------
--
------------ -- ----------------------在此示例中，我们使用了 fetchData 函数请求三个 URL。返回的结果通过 Promise.allSettled 进行合并，如果存在错误，则忽略错误，仅将成功的结果返回，并调用 renderData 更新界面。
结论
在本文中，我们介绍了 ES2020 中的 Promise.allSettled 方法，它可以帮助我们处理并发控制中的错误。使用该方法取代 Promise.all 方法，可以使代码更加健壮。因此，我建议你在编写前端项目的过程中多了解并使用该方法。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/67049270d91dce0dc84f5144