promise.all和promise.race用法

最近遇到多文件上传,接口单次只能上传一个,如果有失败就要捕获异常,全部成功拿到返回结果,再提交from表单的需求,因为对promise了解的不够深入,难免还是遇到了一些坑,按理说这样的需求,用promise.all再合适不过,记录一下

promise.all

const p1 = [1, 3, 5, 7, 9].map(item => {
    return new Promise((resolve, reject) => {
        // 比如这要提交某些数据  然后需要成立
        if (!item) {
            reject()
        } else {
            resolve(item)
        }
    })
})
const p2 = [10, 2, 4, 6, 8, 10].map(item => {
    return new Promise((resolve, reject) => {
        // 比如这要拉取某些数据  然后需要成立
        if (!item) {
            reject()
        } else {
            resolve(item)
        }
    })
})
Promise.all([...p2, ...p1]).then((res) => {
    console.log(res) //[10, 2, 4, 6, 8, 10, 1, 3, 5, 7,9]
}).catch(() => {
    console.log('e')
})
  

总结:promise.all参数是一个promise的数组,只有当所有的promise都完成并返回成功,才会调用resolve,当有一个失败,都会进catch,被捕获错误,promise.all调用成功返回的结果是每个promise单独调用成功之后返回的结果组成的数组,如果调用失败的话,返回的则是第一个reject的结果

注意:promise.all会阻塞一起执行的promise,所以要根据业务场景来用.

promise.race

const p1 = [1, 3, 5, 7, 9].map(item => {
    return new Promise((resolve, reject) => {
        // 比如这要提交某些数据  然后需要成立
        if (item == 9) {
            reject()
        } else {
            resolve(item)
        }
    })
})
const p2 = [10, 2, 4, 6, 8, 10].map(item => {
    return new Promise((resolve, reject) => {
        // 比如这要拉取某些数据  然后需要成立
        if (!item) {
            reject()
        } else {
            resolve(item)
        }
    })
})
Promise.race([...p2, ...p1]).then((res) => {
    console.log(res) //10
}).catch(() => {
    console.log('e')
})

promise.race也会调用所有的promise,返回的结果则是所有promise中最先返回的结果,不关心是成功还是失败