Promise.all原理的实现

最新推荐文章于 2025-10-02 11:09:51 发布

原创最新推荐文章于 2025-10-02 11:09:51 发布 · 292 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #html5

本文详细介绍了Promise.all的工作原理及其实现，通过示例展示了如何在1秒和2秒后分别执行的两个Promise任务。同时，自定义了一个名为myPromiseAll的函数，该函数同样能在所有Promise完成后返回结果数组。这两个方法都体现了并行执行Promise并等待全部完成的概念。

首先我们创建两个promise

let p1 = new Promise((resolve,reject)=>{
				setTimeout(()=>{
					resolve(1000)
				},1000)
			})
			let p2 = new Promise((resolve,reject)=>{
				setTimeout(()=>{
					resolve(2000)
				},2000)
			})

一个会在1s中后执行，一个会在两秒钟后执行。当我们使用promise.all方法的时候

Promise.all([p1,p2]).then(res=>{
				console.log(res)
			})

控制台会在两秒钟后返回给我们想要的值，因为promise.all方法会等待最后一个promise执行完成之后才会返还给我们值。

function myPromiseAll(lists){
				return new Promise((resolve,reject)=>{
					let resArr = []
					let num = 0
					lists.forEach(item=>{
						item.then(res=>{
						   resArr.push(res)
						   num++
						   if(num===lists.length){
							   resolve(resArr)
						   }
						})
					})
				})
			}
			myPromiseAll([p1,p2]).then(res=>{
				console.log(res)
			})

这就是原理了。