关于Promise.all

88 阅读2分钟

用来将多个Promise实力,包装成一个新的Promise实例

let p1 = new Promise((resolve,reject)=>{
    resolve('成功01')
})
let p2 = new Promise((resolve,reject)=>{
    resolve('成功02')
})
let p3 = new Promise((resolve,reject)=>{
    resolve('成功03')
})
 // 参数可以不是数组,但是必须是iterator接口(即可迭代)
let pAll = Promise.all([p1,p2,p3]).then((res)=>{
console.log(res)
})  // ['成功01', '成功02', '成功03']

pAll的状态由p1、p2、p3来决定,只有当三个都为成功,pAll才会成功,否则为失败,第一个失败实例的返回值,会当做参数返回,传递给pAll的回调

let p1 = new Promise((resolve,reject)=>{
    resolve('成功01')
})
let p2 = new Promise((resolve,reject)=>{
    reject('失败02')
})
let p3 = new Promise((resolve,reject)=>{
    resolve('成功03')
})
 // 参数可以不是数组,但是必须是iterator接口()
let pAll = Promise.all([p1,p2,p3]).then((res)=>{
    console.log(res);
}).catch((err)=>{
console.log(err)
})   //  打印catch的值  为  失败02

如果参数的实例自己定义了catch方法,一旦失败reject,不会触发pAll的catch方法

let p1 = new Promise((resolve,reject)=>{
    resolve('成功01')
})
let p2 = new Promise((resolve,reject)=>{
    reject('失败02')
}).catch((err)=>{
console.log(err)
})
let p3 = new Promise((resolve,reject)=>{
    resolve('成功03')
})
 // 参数可以不是数组,但是必须是iterator接口()
let pAll = Promise.all([p1,p2,p3]).then((res)=>{
    console.log(res);
}).catch((err)=>{
console.log(err)
}) 

9268b8636da626b5cfa2b75e83c395b.png 应用:可以将多个请求合并在一起,将结果统一返回

function result1(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve('请求结果1')
        },1000)
    })
}
function result2(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve('请求结果2')
        },2000)
    })
}
function result3(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve('请求结果3')
        },3000)
    })
}
 function initLoad(){
   let all = Promise.all([result1(),result2(),result3()])
   all.then((res)=>{
    console.log(res);
   })
 }
initLoad()
//  ['请求结果1', '请求结果2', '请求结果3']     异步,3s后打印出结果

promise.race:只要实例中有一个先改变状态,就会将返回值作为参数返回

应用:请求超时

关于面试:用promise.all()发十个请求,成功后进行后续操作,不用all的话想实现同样想过该怎么做?

答:定义一个num=0,每成功一次num+1,当num=10是进行下一步操作