什么是 Promise？
在前端领域，我们经常会遇到异步请求的情况，例如请求后端接口获取数据、上传图片等等。Promise 是一种处理异步请求的技术，它可以让异步请求变得更加优雅和易于处理。
Promise 有三种状态：pending（进行中）、fulfilled（已成功）、rejected（已失败）。在异步操作完成之后，Promise 会根据操作的结果更新状态。
Promise.all() 的作用
在实际应用中，我们经常会遇到需要同时发送多个异步请求的情况。在这种情况下，Promise.all() 可以帮助我们更好地管理异步请求。
Promise.all() 接收一个数组作为参数，这个数组中包含多个 Promise 对象。Promise.all() 返回一个新的 Promise 对象，在数组中所有的 Promise 对象都变为 fulfilled 状态，即所有的异步请求都完成之后，Promise.all() 才会变为 fulfilled 状态，并将所有异步请求的数据返回。如果其中有任何一个 Promise 对象变为 rejected 状态，那么 Promise.all() 会变为 rejected 状态。
如何使用 Promise.all()？
一个简单的示例：
----- -------- - -----------------------
----- -------- - -----------------------
---------------------- ----------
------------------ ----------- -- -
-- --------------
--
------------ -- -
-- ----
--在这个示例中，我们使用 fetch() 方法发送了两个请求，即 request1 和 request2。将这两个 Promise 对象包装在一个数组中，并传递给 Promise.all() 方法。
在 Promise.all() 的 then() 方法中，我们可以通过解构赋值将请求的返回结果分别赋值给 response1 和 response2。如果有任何一个请求出错，那么 Promise.all() 中的 catch() 方法会被调用。
Promise.all() 的注意事项
Promise.all() 的异常处理
在 Promise.all() 中，如果其中一个 Promise 对象发生了错误，Promise.all() 就会立即结束。在这种情况下，我们可以使用 Promise.race() 来解决这个问题。
----- -------- - -----------------------
----- -------- - -----------------------
----------------------- ----------
-------------- -- -
-- ----
--
------------ -- -
-- ----
--在上面的示例中，Promise.race() 将会返回一个新的 Promise 对象，在这里只有最快的请求会被解析。在这种情况下，如果有任何一个错误，Promise.race() 中的 catch() 方法会被调用。
并发请求的数量
在使用 Promise.all() 时需要注意的一点是，一次性发送过多的异步请求可能会导致网络堵塞。为了防止这种情况的发生，我们可以将异步请求的数量限制为一定的数量。
----- ---- - ------------------ ----------------- -----------------
----- ----- - -
----- -------- - --
--- ---- - - -- - - ------------ - -- ------ -
----- ------- - ------------- - - ------
----- ----------- - --------------- -- -----------
----- ---------- - ------------------------
-------------------------
-
---------------------
--------------- -- -
-- ---------
--
------------ -- -
-- ----
--在上面的示例代码中，我们将所有待请求的 URL 放在一个数组中，然后将数组划分为多个部分，每部分包含指定数量的 URL。然后对于每一部分中的 URL，我们都创建一个 Promise 对象，放入一个数组中，并最后将这个 Promise 对象数组放入 Promise.all() 中。
结论
ECMAScript 2016 中的 Promise.all() 是一个强大的工具，可以帮助我们方便地处理异步操作。在使用 Promise.all() 时，我们需要注意异常情况的处理，控制并发请求数量，并且确保每个 Promise 对象的返回结果结构与预期一致。使用 Promise.all() 能够避免在实际开发中可能遇到的一些问题，让代码变得更简单和易于维护。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/671e04b12e7021665ef52378