实现Promise.all(), Promise.race()

138 阅读1分钟

Promise.all()

Promise.all原理:

  1. all方法是一个静态方法。
  2. all方法返回一个Promise对象。
  3. all方法传入的是一个带有Promise对象的数组,只有数组中的Promise对象都成功执行,才能回调成功方法,如果有失败,则调用失败方法。
function all(arr) {
    // 是不是数组?
    if (!Array.isArray(arr)) throw new Error('This Argument should be an Array')
    return new Promise((resolve, reject) => {
        // 返回的新数组
        let result = []
            // 统计成功数量
        let count = 0
            // 遍历该数组
        for (let i = 0; i < arr.length; i++) {
            // 是不是promise?
            if (arr[i] instanceof Promise) {
                arr[i].then(res => {
                        addData(i, res)
                    },
                    rej => {
                        reject(rej)
                    })
            } else {
                // 如果是普通值就直接添加
                addData(i, arr[i])
            }
        }

        // 用来往数组中添加数据,和执行完毕时调用resolve
        function addData(i, value) {
            result[i] = value
            count++
            count === arr.length ? resolve(result) : ''
        }
    })
}

let p1 = new Promise((resolve, reject) => { resolve(1) })
let p2 = new Promise((resolve, reject) => { resolve(2) })
let p3 = new Promise((resolve, reject) => { reject(3) })
let p4 = new Promise((resolve, reject) => { resolve(4) })
all([p1, p2, p3, p4]).then(result => {
    console.log(result);
}).catch(reason => {
    console.log(reason); // 2
})
all([p1, p2, p4]).then(result => {
  console.log(result); // [1,2,4]
}).catch(reason => {
  console.log(reason); 
})

执行效果:

Snipaste_2021-08-16_19-36-07.png

Promise.race()

接受一个数组,返回最先执行完成结果

这个结果依然是一个Promise

function race(arr) {
    if (!Array.isArray(arr)) throw new Error('This Argument should be an Array')
    return new Promise((resolve, reject) => {
        for (let i = 0; i < arr.length; i++) {
            arr[i] instanceof Promise ? arr[i].then(resolve, reject) : resolve(arr[i])
        }
    })
}