ES11的Promise.allSettled

Promise.all([
    Promise.resolve({
        code:200,
        data:[1,2,3]
    }),
    Promise.resolve({
        code:200,
        data:[4,5,6]
    }),
    Promise.resolve({
        code:200,
        data:[7,8,9]
    })
]).then(res => {
    console.log(res)
    console.log("成功")
}).catch(err => {
    console.log(err)
    console.log("失败")
})  // [{code:200,data:[1,2,3]},{code:200,data:[4,5,6]},{code:200,data:[7,8,9]}]  成功

用这个方法的时候，每个参数都是Promise对象，如果每一次请求都成功的时候，痛点并没有显现那么明显，当中间有一次请求失败或者异常的时候，就会这样

Promise.all([
    Promise.resolve({
        code:200,
        data:[1,2,3]
    }),
    Promise.reject({
        code:500,
        data:[]
    }),
    Promise.resolve({
        code:200,
        data:[7,8,9]
    })
]).then(res => {
    console.log(res)
    console.log("成功")
}).catch(err => {
    console.log(err)
    console.log("失败")
})  // {code: 500, data: Array(0)}  失败

这样就完全掩盖了请求成功的回调，所以在es11中引入了Promise.allSettled方法，使用方法如下

Promise.allSettled([
    Promise.resolve({
        code:200,
        data:[1,2,3]
    }),
    Promise.reject({
        code:500,
        data:[]
    }),
    Promise.resolve({
        code:200,
        data:[7,8,9]
    })
]).then(res => {
    console.log(res)
    console.log("成功")
}).catch(err => {
    console.log(err)
    console.log("失败")
})  // [{status:"fulfilled",value:{code:200,data:[1,2,3]}},{status:"rejected",value:{code:500,data:[]}},{status:"fulfilled",value:{code:200,data:[7,8,9]}}]

最后可以通过数据的status和value，应用filter或者map高阶函数进一步筛选数据。又是增加技能的一天，大家一起加油！