前言
本文整理了Promise的一些方法的底层原理实现,如果对答案有不一样见解的同学欢迎评论区补充讨论,当然有问题,也欢迎在评论区指出。
1、Promise.all()
//或者 Promise.prototype.all = function(promiseArray){}
function PromiseAll(promiseArray) {
return new Promise(function(resolve,reject){
//判断参数类型
if(!Array.isArray(promiseArray)){
return reject(new TypeError('arguments muse be an array'))
}
let counter = 0,
promiseNum = promiseArray.length,
resolvedArray = new Array(promiseNum);
for(let i = 0; i < promiseNum; i++){
Promise.resolve(promiseArray[i]).then(function(value){
counter++;
resolvedArray[i] = value;
if(counter === promiseNum){
return resolve(resolvedArray)
}
},function(reason){
return reject(reason)
})
}
})
}
// 创建测试用例
const createPromise =function (value,delay){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(value)
},delay)
})
}
const promiseList= [createPromise(1,1000),createPromise(2,2000),createPromise(3,3000)]
PromiseAll(promiseList)
.then(res => console.log(res)) // 3秒之后打印 ["1", "2", "3"]
.catch((err) => console.log(err))
2、Promise.allSettled()
//返回的是 每个promise的结果(数组) 不管是成功还是失败的结果都返回
const PromiseAllSettled = function (promiseArray) {
return new Promise((resolve, reject) => {
// 代码健壮性,判断一下promises是一个数组
if (!Array.isArray(promiseArray))
return reject(new TypeError('args must be an array'));
// 闭包,保存一下结果数组
const res = [];
// 计数
let count = 0;
for (let i = 0; i < promiseArray.length; i++) {
Promise.resolve(promiseArray[i]).then(data => {
res[i] = data;
}).catch(err => {
res[i] = err;
}).finally(() => {
//Promise.prototype.finally在promise结束时,无论结果是fulfilled或者是rejected,都会执行指定的回调函数
count++;
if (count === promiseArray.length) {
resolve(res);
}
})
}
})
}
3、Promise.race()
//赛跑-----Promise.race([p1, p2, p3])返回那个最快完成的结果,不管结果本身是成功状态还是失败状态。
//Promise.any() 接收一个Promise可迭代对象,返回那个最先成功的结果。如果没有一个 promise 成功(即所有的 promises 都失败/拒绝),就返回一个失败的 promise
const PromiseRace = function(promiseArray){
return new Promise((resolve,reject)=>{
if(!Array.isArray(promiseArray)) reject(new TypeError('args must be an array'));
promiseArray.forEach(promise => {
Promise.resolve(promise)
.then((value)=>resolve(value))
.catch((error)=>reject(error))
})
})
}
总结
觉得写得好的,对你有帮助的,可以分享给身边人,知识越分享越多,千万不要吝啬呀
后续更新promise相关基础和一些方法的底层原理实现总结,请关注我,整理好,分享给你们,我们一起学前端。