在前端开发中，用到异步操作的机会非常多。经常我们需要发起多个并行的异步请求，并在所有请求都完成后进行下一步的操作。在 ES6 中，Promise.all() 方法让我们可以同时处理多个异步操作，并在所有操作完成后接收返回结果，这已经非常便利了。但在 ES9 中，Promise.all() 方法又有了新的提升，可以通过新增功能来进一步优化我们的异步代码。
ES6 中的 Promise.all()
ES6中的Promise.all() 接收一个 Promise 数组，返回一个新的 Promise 对象 。只有当所有 Promise 对象都成功的执行了其任务，返回的 Promise 对象才会触发成功状态，其状态值为所有 Promise 对象的状态值的数组。
---------------------- --------- -----
------------------------ -------- ------
-- --- ------- -----------
-----------------------------
--
-----------------------
-- ----- ------- ------------------------
--------------------------- -------
---使用 Promise.all() 方法可以显著简化我们的异步操作代码。然而，在某些情况下，我们需要在有些 Promise 任务失败的情况下，继续执行代码。这就需要用到 ES9 中 Promise.all() 的新特性。
ES9 中 Promise.all() 的新特性
在 ES9 中，Promise.all() 方法不仅可以接收 Promise 数组，还可以接收任何迭代器的数据结构，比如 Set、Map，只要其中的每一项都是 Promise 对象。这使得我们可以更方便的使用 Promise.all() 方法，并且能够处理更多的场景。
另外一个值得注意的是，ES9 中的 Promise.all() 比 ES6 中的在错误处理上更友好。如果其中一个 Promise 对象的状态变为 rejected，Promise.all() 仍然会等待其他 Promise 对象完成并将 results 数组返回，而不是直接进入错误处理阶段。
下面的代码演示了一个多元素异步处理的例子，假设一个函数异步获取远程地址列表并处理，如果其中一个请求失败则捕获这个错误，打印错误信息，并继续处理其他的请求结果。
-- ------------- --
----- -------- ----------------------- -
----- -------- - --------------- -- -
------ -------------------- -- -
-------------------- -------- -----
------ -----
---
---
----- --------- - ----- ----------------------
----- ---- - ----- ----------------------------- -- -------------
------------------
------ -----
-
-- ----
----- -------- ----------------------- -
----- --------- - ---
--- ------ --- -- -------- -
--- -
----- -------- - ----- -----------
-------------------------
- ----- ----- -
-------------------- -------- -----
---------------------
-
-
----- ---- - ----- ------------
---------------------- -- -------- - --------------- - -----
--
------------------
------ -----
-比较集合与Promise.all的实现，我们可以看出，Promise.all() 是利用并行性去操作多个异步对象的解决方案。集合的实现则用序列性去操作多个异步对象。如果您认为您不需要一次性处理所有异步对象，那么您可以考虑集合的实现。否则，Promise.all() 的实现可以是最佳的选择。
总结
ES9 中的 Promise.all() 带来了很多实用的特性，通过它我们可以更方便地进行异步操作的处理，提升代码的可读性、复用性和性能。但是在使用时也要注意场景的选择，以优化代码。我们希望这篇文章可以帮助您更好地使用 ES9 中的 Promise.all() 来改进您的异步代码。
参考
MDN web docs - Promise.all() Dmitri Pavlutin - ES6 Promise.all() and Promise.race() in JavaScript with examples Web Delta - Better Ways of Handling Multiple Promises in Parallel
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64c1b74c83d39b48815f06f3