简介
Promise.all() 方法在前端开发中是非常常见的一种异步编程解决方案。它实现了在一组 Promise 执行完毕后再进行下一步操作的功能，极大地方便了我们在业务逻辑代码中的编写。
在 ES10 中，JavaScript 引入了 Promise.allSettled() 方法，它与 Promise.all() 方法功能相似，但是会等待所有的 Promise 都执行完成，不管是否 resolve 或 reject。但 Promise.allSettled() 方法在我们经常处理的场景中并不常用，因此本文重点分享如何手写 Promise.all() 方法，帮助我们更好地理解 Promise，以及优化我们的异步编程体验。
Promise.all() 方法
Promise.all() 方法接收一个 Promise 数组，然后等待所有 Promise 都 resolve 后返回一个包含所有执行结果的 Promise（reject 第一个 rejected Promise 的结果）。示例代码如下：
-------- -------------------- -
------ --- ----------------- ------- -- -
--- ------- - ---
--- ----- - --
-------------------------- ------ -- -
-------------------- -- -
-------------- - ------
--------
-- ------ --- ---------------- -
-----------------
-
---------------- -- -
--------------
---
---
---
-
----- -------- - -------------------
----- -------- - -------------------
----- -------- - ---------------------- --- ------- -----------
--------------------- --------- ----------
--------------- -- -
--------------------- -- ---- ------- ------- ---- --- --
--
-------------- -- -
--------------------- --- ------ --- ------- --------
---分析
上述代码通过 Promise.all() 方法包装了传入的 Promise 数组，创建了一个新的 Promise 实例返回。Promise.all() 中的核心逻辑是通过一个计数器来计算 resolve 或 reject 的 Promise 数量，如果等于传递的 Promise 数组的长度，则执行 resolve 或 reject。
基于该逻辑，我们可以进一步拆解代码中的 promiseAll() 方法。
首先，我们创建一个新的 Promise 对象，然后使用 forEach() 方法循环遍历传入的 Promise 数组，对每个 Promise 进行 resolve 和 reject 的处理。
处理 resolve 时，将返回的结果存储在一个结果数组中，同时将计数器加一，当计数器等于传递的 Promise 数量时，执行 resolve 方法。
处理 reject 时，直接执行 reject 方法。
最后，我们将整个方法封装到 try-catch 块中，并添加必要的异常检查，确保代码实现的完整性和鲁棒性。
总结
通过手写 Promise.all() 方法的实现，我们加深了对 Promise 的理解，同时掌握了重要的异步编程实践中的核心逻辑。希望本篇文章的内容能够与读者分享更多的技术细节和思路，帮助大家在实际开发中遇到 Promise 相关问题时能够更加游刃有余。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64c8bad85ad90b6d041484c2