在前端开发中，异步操作是很常见的，而 Promise 对象可以帮助我们更方便地处理异步操作，提高代码的可读性和维护性。Promise.allSettled 是 Promise 的一个扩展方法，它与 Promise.all 相似，但不同的是，它会等待所有的 Promise 对象都 settled（即 fulfilled 或 rejected）之后才返回结果。本文将比较 Promise 和 Promise.allSettled，并介绍它们的使用场景和示例代码。
Promise 和 Promise.allSettled 的比较
Promise 是 ECMAScript 6 中新增的特性，用于处理异步操作。它有三种状态：pending（等待状态）、fulfilled（成功状态）和 rejected（失败状态）。Promise 对象是一个包装了异步操作的容器，它有一个 then 方法，可以注册在 Promise 对象状态改变时的回调函数。Promise 有链式调用的特点，可以通过 then 方法将多个异步操作串联起来。
Promise.all 方法接受一个 Promise 对象的数组作为参数，返回一个新的 Promise 对象，该 Promise 对象在所有 Promise 对象都成功时才会 fulfilled，其中一个 Promise 对象失败时则会 rejected。
Promise.allSettled 方法接受一个 Promise 对象的数组作为参数，返回一个新的 Promise 对象，该 Promise 对象在所有 Promise 对象都 settled（即 fulfilled 或 rejected）之后才会返回结果。这样即使其中一个 Promise 对象失败，也不会影响其他 Promise 对象的运行。
Promise 和 Promise.allSettled 的使用场景
Promise 的使用场景
Promise 可以方便的进行异步编程，避免了回调地狱，让异步操作更加清晰、可读、易于维护。Promise 可以用于以下场景：
- AJAX 请求。使用 Promise 封装 AJAX 请求，可以使代码更加清晰可读，同时避免回调地狱。
-- -------------------- ---- -------
-------- ------------ -
------ --- ----------------- ------- -- -
----- --- - --- -----------------
--------------- -----
---------- - ---------- -
-- ----------- --- ---- -
----------------------
- ---- -
------------------------------
-
--
----------- - ---------- -
--------------------- ---------
--
-----------
---
-
--------------------
------------------------ -
----------------------
--
---------------------- -
-------------------
---- 定时任务。使用 Promise 可以方便地进行异步定时任务，例如每隔一段时间执行一次某个操作。
-- -------------------- ---- -------
-------- ---------- -
------ --- ----------------- ------- -- -
------------------- ------
---
-
----------
------------------------ -
-------------- ------ ---------
--
---------------------- -
-------------------
---- DOM 事件。使用 Promise 可以方便地封装 DOM 事件，例如点击按钮后执行某个操作。
-- -------------------- ---- -------
-------- ------------- -
------ --- ----------------- ------- -- -
-------------------------------- ---------
---
-
----- ------ - ---------------------------------
-------------
------------------------ -
------------------- -----------
--
---------------------- -
-------------------
---Promise.allSettled 的使用场景
Promise.allSettled 可以用于以下场景：
- 多个 Promise 对象都需要执行，但其中一个 Promise 对象失败不影响其他 Promise 对象的执行。例如向多个不同的 API 请求数据，即使其中一个 API 响应很慢或者失败，也不会影响其他 API 的结果。
-- -------------------- ---- -------
----- ---- - -------------- ------------- --------------
------------------------------- -- ------------
------------------------- -
------------------------------------ -
-- ---------------- --- ------------ -
----------------------------
- ---- -
-----------------------------
-
---
--
---------------------- -
-------------------
---- 多个异步操作执行顺序无关，且每个异步操作都会有一个结果需要处理。例如向多个不同的节点发送请求，返回每个节点的响应状态。
-- -------------------- ---- -------
----- ----- - --------------------- -------------------- ---------------------
--------------------------------- -- -----------------------------------
------------------------- -
------------------------------------ -
-- ---------------- --- ------------ -
------------------------------------ ---------------------------
- ---- -
------------------------------------- ----------------------------
-
---
--
---------------------- -
-------------------
---结论
Promise 可以使异步编程更加清晰、可读、易于维护，而 Promise.allSettled 则更适用于多个异步操作互不影响的场景。当我们需要执行多个不同的异步操作，但不希望其中一个失败影响其他操作时，Promise.allSettled 可以在保证所有异步操作执行完毕后返回所有操作的结果，方便我们对异步操作的处理和分析。
参考资料
- Promise.all() MDN 文档
- Promise.allSettled() MDN 文档
- Promise 对象 - ECMAScript 6 入门教程
- JavaScript Promise API 的另一半
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66fa553744713626014b77cd