前端积累 | 手写Promise.all()

Promise.all()方法接收一个Promsie数组，返回一个新的Promsie（下文称作newPromise）。newPromsie的状态由提供的数组中的所有Promise的状态决定。如果所有的Promise全部都被resolve，newPromise才会被resolve；反之一旦有一个被reject的话，newPromsie就会被reject。

const promise1 = new Promise((res,rej)=>{
    res(1);
});
const promise2 = new Promise((res,rej)=>{
    res(2);
})
const promise3 = new Promise((res,rej)=>{
    res(3);
})
Promise.all([promise1,promise2,promise3]).then((values)=>{
    values// [1,2,3]
})

实现思路

使用的时候已经基本解释了它的原理，因此我们直接根据这些文字来进行复刻就好。

1. 返回一个Promise
2. 在这个Promise内部resolve所有的数组元素，当已解决的元素个数达到要求时结束。、
3. 把结果传给对应的数组中
4. 如果元素中有一个出现了问题，直接结束整个Promise。

代码实现

Promise.myAll= function(promises){
    return new Promise((resolve,reject)=>{
        let resolved =0;
        let results =[];
        for(let i=0;i<promises.length;i++){
            Promise.resolve(promises[i])
                .then((res)=>{
                    resolved++;
                    results[i] = res;
                    if(resolved === promises.length){
                        resolve(results);
                    }
                })
                .catch((e)=>{
                    reject(e);
                })
        }
    })
}
const promise1 = new Promise((res,rej)=>{
    res(1);
});
const promise2 = new Promise((res,rej)=>{
    res(2);
})
const promise3 = new Promise((res,rej)=>{
    res(3);
})
Promise.myAll([promise1,promise2,promise3]).then((values)=>{
    values// [1,2,3]
})

注意事项

• 上文的代码并没有判断传入的是否为可迭代对象，因此在日常使用的时候其实最好添加一段判断代码为妙。