ES11 中 Promise.allSettled() 方法解决的常见问题
在前端开发中，异步操作是非常常见的。由于 JavaScript 是单线程语言，因此异步操作能够避免阻塞线程，提高程序的运行效率。Promise 是 JavaScript 中一种非常重要的异步操作方式，它可以让我们更方便地处理异步操作。在 ES11 中，新增了 Promise.allSettled() 方法，可以解决 Promise.all() 方法存在的一些问题。
Promise.all() 方法
在介绍 Promise.allSettled() 方法之前，我们先来了解一下 Promise.all() 方法。
Promise.all() 方法接收一个数组作为参数，数组中的每个元素都是一个 Promise 对象。当数组中所有的 Promise 对象都变成了 resolved 状态时，Promise.all() 方法才会返回一个新的 Promise 对象。这个新的 Promise 对象的 resolved 值是一个数组，数组中的每个元素都是数组中对应的 Promise 对象的 resolved 值。如果数组中有任意一个 Promise 对象变成了 rejected 状态，则新的 Promise 对象就会变成 rejected 状态，返回的 rejected 值是第一个变成 rejected 状态的 Promise 对象的 rejected 值。
下面是一个使用 Promise.all() 方法的示例代码：
----- -- - --- ----------------- ------- -- -
------------- -- -
----------- -----------
-- ------
---
----- -- - --- ----------------- ------- -- -
------------- -- -
---------- --------- ------------
-- ------
---
---------------- ----
------------- ------ -- -
------------------
------------------
--
------------ -- -
-------------------
---在上面的代码中，我们创建了两个 Promise 对象 p1 和 p2，p1 在 1 秒后变成了 resolved 状态，p2 在 2 秒后变成了 rejected 状态。我们使用 Promise.all() 方法将这两个 Promise 对象放到一个数组中，并使用 then() 和 catch() 方法来处理结果。
由于 Promise.all() 方法要等到所有 Promise 对象都变成 resolved 状态才会返回 resolved 值，因此在上面的代码中，我们会等待 2 秒才能得到结果。如果我们只关心每个 Promise 对象的状态，而不关心它们的 resolved 值，那么 Promise.all() 方法就显得有些力不足。
Promise.allSettled() 方法
ES11 中新增了 Promise.allSettled() 方法，可以解决 Promise.all() 方法存在的一些问题。Promise.allSettled() 方法接收一个数组作为参数，数组中的每个元素都是一个 Promise 对象。当数组中所有的 Promise 对象都变成了 settled 状态时，Promise.allSettled() 方法才会返回一个新的 Promise 对象。这个新的 Promise 对象的 resolved 值是一个数组，数组中的每个元素都是一个对象，对象中包含了对应的 Promise 对象的状态和值。
下面是一个使用 Promise.allSettled() 方法的示例代码：
----- -- - --- ----------------- ------- -- -
------------- -- -
----------- -----------
-- ------
---
----- -- - --- ----------------- ------- -- -
------------- -- -
---------- --------- ------------
-- ------
---
----------------------- ----
--------------- -- -
---------------------
--
------------ -- -
-------------------
---在上面的代码中，我们使用 Promise.allSettled() 方法将 p1 和 p2 放到一个数组中，并使用 then() 和 catch() 方法来处理结果。
在 Promise.allSettled() 方法的回调函数中，我们可以得到一个数组 results，这个数组中的每个元素都是一个对象，对象中包含了对应的 Promise 对象的状态和值。如果 Promise 对象变成了 resolved 状态，对象中的 status 属性值为 'fulfilled'，value 属性值为 resolved 值；如果 Promise 对象变成了 rejected 状态，对象中的 status 属性值为 'rejected'，reason 属性值为 rejected 值。
Promise.allSettled() 方法的优势在于，即使数组中有 Promise 对象变成了 rejected 状态，也不会影响其他 Promise 对象的状态。这样我们就可以更方便地处理异步操作了。
总结
ES11 中新增的 Promise.allSettled() 方法可以解决 Promise.all() 方法存在的一些问题，使我们更方便地处理异步操作。在使用 Promise.allSettled() 方法时，我们需要注意回调函数中得到的结果数组中的每个元素都是一个对象，对象中包含了对应的 Promise 对象的状态和值。如果我们只关心每个 Promise 对象的状态，而不关心它们的 resolved 值，那么 Promise.allSettled() 方法就是一个非常好的选择。
希望本文能够对大家了解 Promise.allSettled() 方法有所帮助。最后，附上本文的示例代码：
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65dc6b401886fbafa49d206a