异步编程一直是前端开发中不可避免的问题。在处理多个异步任务时，我们通常会使用 Promise，这可以很好地解决回调地狱的问题。但是，Promise 也带来了新的问题，比如同步和顺序执行、错误处理等。在本文中，我们将介绍 ES6 中的 Promise.allSettled() 方法，它可以帮助我们轻松地解决这些问题。
同步和顺序执行
在处理多个异步任务时，我们通常会在 then() 方法中嵌套多个 Promise。这样虽然可以实现异步执行，但是由于每个 Promise 块之间是互相独立的，无法控制它们的执行顺序。如果我们想让它们按照某种顺序执行，就需要在每个 then() 中再嵌套一个 Promise，使它们形成链式调用。这样对于简单的异步操作来说还可以，但是一旦涉及到复杂的异步依赖关系，代码就会变得混乱难懂。
ES6 的 Promise.allSettled() 方法可以帮助我们解决这个问题。它可以接收包含多个 Promise 的数组作为参数，返回一个新的 Promise，该 Promise 将在所有的 Promise 完成时解决，并提供每个 Promise 的处理结果。在这个过程中，由于 Promise.allSettled() 方法会等待所有的 Promise 完成，因此可以保证它们按照预定的顺序执行。
下面是一些示例代码：
-- -------------------- ---- -------
----- ----- - -- -- -
------ --- --------------- -- -
------------- -- -
------------- - ------------
-- ------
---
--
----- ----- - -- -- -
------ --- --------------- -- -
------------- -- -
------------- - ------------
-- ------
---
--
----- ----- - -- -- -
------ --- --------------- -- -
------------- -- -
------------- - ------------
-- ------
---
--
---------------------------- -------- ---------
------------- -- -
---------------------- -- -
--------------------------
---
--
------------ -- -
---------------------
---上面的代码中，我们定义了三个 Promise，分别代表三个异步任务。然后我们将它们作为数组参数传递给 Promise.allSettled() 方法。在 then() 方法中，我们可以获得每个 Promise 的处理结果，并按照它们的顺序打印出来。
错误处理
在处理异步任务时，错误处理也是一个重要的问题。由于每个 Promise 的结果是独立的，因此当其中一个 Promise 抛出错误时，整个 Promise 链就会被中断。如果我们只关心所有 Promise 是否都成功，而不关心其中一个 Promise 失败的原因，那么这可能是可以接受的。但是，当我们需要了解 Promise 链中发生错误的原因时，就需要对错误进行有效的处理。
ES6 的 Promise.allSettled() 方法在处理错误方面还是非常灵活的。在多个 Promise 中，如果有一个 Promise 抛出错误，它并不会导致整个 Promise 链中断。相反，它会得到处理，并将其结果储存在一个对象中，以便我们在后续处理中进行分析。这使得我们能够更好地了解在处理异步任务时需要检查的各种错误情况。
下面是一些示例代码：
-- -------------------- ---- -------
----- ----- - -- -- -
------ --- --------------- -- -
------------- -- -
--------- -------- ----- - ---------- ---
-- ------
---
--
----- ----- - -- -- -
------ --- ----------------- ------- -- -
------------- -- -
---------- ----------- - ----------
-- ------
---
--
----- ----- - -- -- -
------ --- --------------- -- -
------------- -- -
--------- -------- ----- - ---------- ---
-- ------
---
--
---------------------------- -------- ---------
------------- -- -
---------------------- -- -
-- -------------- --- ------------ -
----------------------------------
- ---- -
-------------------------------------
-
---
---在上面的示例代码中，我们在第二个异步任务中故意抛出一个错误。当我们在 then() 方法中迭代处理结果时，我们会检查结果的状态是否为“fulfilled”，如果是，则输出它的结果，否则输出错误原因。
结论
在本文中，我们介绍了 ES6 的 Promise.allSettled() 方法，它可以帮助我们解决异步任务按顺序执行和错误处理的问题。我们演示了如何将多个 Promise 传递给该方法，并在其处理后获取每个 Promise 的结果。我们还演示了如何处理 Promise 中的错误，以便我们能够更好地理解异步任务的执行路径。总的来说，Promise.allSettled() 方法是一个非常强大和有用的工具，它可以帮助我们更轻松地处理异步编程问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6719efd4c30a6eff8b88444c