在前端开发中，我们经常会遇到需要同时发起多个请求的情况，这时候我们可能需要用到 Promise.all() 方法，该方法可以接收一个可迭代的对象并返回一个新的 Promise 对象，等待所有的 Promise 对象执行完毕后进行下一步操作。
但是，Promise.all() 存在一些问题，比如如果其中任意一个 Promise 对象出现了错误，那么整个方法的执行就会被停止，并且返回的 Promise 对象也会直接进入 rejected 状态，无法得到我们想要的结果。
为了解决这个问题，我们可以使用 Promise.allSettled() 方法，该方法可以返回所有 Promise 对象的结果（无论是 resolved 还是 rejected），直到所有的 Promise 对象都执行完毕后才会进入下一步操作。
语法及参数
Promise.allSettled(iterable)
其中，iterable 表示可迭代的对象，比如数组、字符串等等。
返回值
Promise.allSettled() 返回一个 Promise 对象，该对象在所有的 Promise 对象都执行完毕后才会进入下一步操作。该 Promise 对象的结果是一个数组，数组中存放的是所有 Promise 对象的结果，无论是 resolved 还是 rejected。
使用示例
基本用法
----- -------- - ------------------- ----- -------- - ------------------------ ----- -------- - ------------------- ----------------------------- --------- ---------- ------------- -- --------------------- ------------ -- --------------------
上面的代码中，我们同时发起了三个请求，分别是 promise1、promise2 和 promise3。其中，promise2 是一个 rejected 状态的 Promise 对象。
执行 Promise.allSettled() 后，我们得到以下结果：
- -------- ------------ ------ --- -------- ----------- ------- --------- -------- ------------ ------ -- -
可以看到，该方法返回了一个包含三个 Promise 对象的结果的数组，在 Promise 对象的值中，如果是 resolved 状态，那么属性名为 value，否则属性名为 reason。
使用 Promise.allSettled() 包装 Promise.race() 方法
----- -------- - --- ----------------- ------- -- - ------------- -- -------------------- ------ --- ----- -------- - --- ----------------- ------- -- - ------------- -- ---------------- ----- --- ----------------------------- ----------------------- -- ----------------------
上面的代码中，我们使用 Promise.race() 方法返回了一个先执行完毕的 Promise 对象的值。由于 promise2 的执行时间比 promise1 短，因此返回的结果中 promise2 先于 promise1 执行结束。
执行 Promise.allSettled() 方法后，结果如下：
-
-
--------- ------------
-------- ----------
--
-
--------- -----------
--------- -------
-
-可以看到，使用 Promise.allSettled() 包装 Promise.race() 方法时，可以保证所有的 Promise 对象都被处理并返回其结果。
总结
Promise.allSettled() 方法能够让我们在处理多个 Promise 对象时更加稳定和安全，可以避免因为其中一个 Promise 对象的错误而导致整个方法执行失败的情况。
在实际开发中，我们可以结合 Promise.allSettled() 和 Promise.race() 等方法一起使用，实现更加复杂的逻辑。同时，我们也需要注意 Promise 对象的执行顺序，以避免造成不必要的错误。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6475c317968c7c53b02c41da