美文网首页IT柠檬前端
Promise.all 处理error

Promise.all 处理error

作者: Dannn_Y | 来源:发表于2018-08-05 20:46 被阅读2860次

    Promise.all()接受一个由promise任务组成的数组,可以同时处理多个promise任务,当所有的任务都执行完成时,Promise.all()返回resolve,但当有一个失败(reject),则返回失败的信息,即使其他promise执行成功,也会返回失败。可以用一句话来说Promise.all(),要么全有要么全无。

    但话又说回来,有时候我们使用Promise.all()执行很多个网络请求,可能有一个请求出错,但我们并不希望其他的网络请求也返回reject,要错都错,这样显然是不合理的。

    而我们需要的是即使有一两个接口请求失败,我们依然可以获取到成功的接口请求数据。

    要想理解Promise.all()的机制请看上一篇《理解promise》中的Promise.All示例

    那下面说说如何做才能做到promise.all中即使一个promise程序reject,promise.all依然能把其他数据正确返回。

    首先我们先创建一个resolve和reject的promise函数

    const promiseResove = (promiseResolveSecond = function(n=0){
        return new Promise(function(resolve, reject){
            setTimeout(function() {
                resolve({
                    resolveAfterSeconds: n
                })
            }, n * 100);
        })
    })
    
    const promiseReject = (promiseRejectSecond = function(n=0) {
        return new Promise(function(resolve, reject) {
            setTimeout(function () {
                reject({
                    rejectAfterSeconds: n
                })
            }, n * 100)
        })
    })
    

    使用上面的函数创建一个所有结果能正确返回的promise.all程序

    var promiseArray = []
    promiseArray.push(promiseResove(1))
    promiseArray.push(promiseResove(3))
    promiseArray.push(promiseResove(2))
    
    var handlePromise = Promise.all(promiseArray)
    handlePromise.then(function(values) {
        console.log('all promise are resolved', values)
    }).catch(function(reason) {
        console.log('promise reject failed reason', reason)
    })
    
    • 执行结果如下


      promise all resolve

    然后在创建一个拥有reject函数返回的promise

    var promiseArray = []
    promiseArray.push(promiseResove(1))
    promiseArray.push(promiseReject(3))
    promiseArray.push(promiseResove(2))
    
    var handlePromise = Promise.all(promiseArray)
    handlePromise.then(function(values) {
        console.log('all promise are resolved', values)
    }).catch(function(reason) {
        console.log('promise reject failed reason', reason)
    })
    
    • 执行结果如下


      promise all with reject

    promise.all中有一个promise执行失败返回reject时,promise.all直接返回执行失败的promise结果。

    但我们还想看到其他两个resolve的结果,所以后面用一个trick方法,来解决这个问题。

    代码修改如下

    var promiseArray = []
    promiseArray.push(promiseResove(1))
    promiseArray.push(promiseReject(3))
    promiseArray.push(promiseResove(2))
    
    // 将传入promise.all的数组进行遍历,如果catch住reject结果,
    // 直接返回,这样就可以在最后结果中将所有结果都获取到
    var handlePromise = Promise.all(promiseArray.map(function(promiseItem) {
        return promiseItem.catch(function(err) {
        return err
      })
    }))
    handlePromise.then(function(values) {
        console.log('all promise are resolved', values)
    }).catch(function(reason) {
        console.log('promise reject failed reason', reason)
    })
    

    和之前唯一的不同就是在promise数组添加了一个回调函数,当数组中有接口reject时,catch住结果直接返回,这样失败的结果也可以当做成功处理,所以在promise.all中我们可以监听到所有结果的返回,然后在针对不同的返回值进行处理。


    参考链接
    https://stackoverflow.com/questions/30362733/handling-errors-in-promise-all

    相关文章

      网友评论

        本文标题:Promise.all 处理error

        本文链接:https://www.haomeiwen.com/subject/gnhivftx.html