Promise對象all與race方法手寫示例

前言

在理解瞭手寫promsie.then的方法後,再來看它的其他方法,感覺真的簡單瞭不少。

Promise.all

介紹

Promise.all()方法用於將多個 Promise 實例,包裝成一個新的 Promise 實例。

  const p = Promise.all([p1, p2, p3]);

上面代碼中,Promise.all()方法接受一個數組作為參數,p1p2p3都是 Promise 實例。另外,Promise.all()方法的參數可以不是數組,但必須具有 Iterator 接口,且返回的每個成員都是 Promise 實例。

p的狀態由p1p2p3決定,分成兩種情況。

(1)隻有p1p2p3的狀態都變成fulfilledp的狀態才會變成fulfilled,此時p1p2p3的返回值組成一個數組,傳遞給p的回調函數。

(2)隻要p1p2p3之中有一個被rejectedp的狀態就變成rejected,此時第一個被reject的實例的返回值,會傳遞給p的回調函數。

手寫

  • 返回一個Promsie對象
const promiseAll = (array) => {
    return new Promise((resolve, reject) => {
    })
}
  • 判斷傳入的是數組
const promiseAll = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要傳入數組')
    }
    return new Promise((resolve, reject) => {
    }
}
  • 遍歷數組,再判斷數組中每個元素是否為Promsie對象的實例,並對此分情況處理
const promiseAll = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要傳入數組')
    }
    return new Promise((resolve, reject) => {
        let result = [];
        array.forEach((item, index) => {
            if (item instanceof Promise) {
                item.then(res => {
                    result[index] = res
                },
                    err => { return reject(err) })
            } else {
                result[index] = item
            }
        })
    })
}
  • 設置一個計數器count,當遍歷完瞭所有數組裡面的值,就把result數組打印出來
const promiseAll = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要傳入數組')
    }
    return new Promise((resolve, reject) => {
        let result = [];
        let count = 0;
        array.forEach((item, index) => {
            if (item instanceof Promise) {
                item.then(res => {
                    result[index] = res
                    count++;
                    if (count == array.length) {
                        return resolve(result)
                    }
                },
                    err => { return reject(err) })
            } else {
                result[index] = item
                count++;
                if (count == array.length) {
                    return resolve(result)
                }
            }
        })
    })
}

Promise.race

介紹

Promise.race()方法同樣是將多個 Promise 實例,包裝成一個新的 Promise 實例。

const p = Promise.race([p1, p2, p3]);

上面代碼中,隻要p1p2p3之中有一個實例率先改變狀態,p的狀態就跟著改變。那個率先改變的 Promise 實例的返回值,就傳遞給p的回調函數。

手寫

  • 返回一個Promise對象
let promiseRace = (array) => {
    return new Promise((resolve, reject) => {
    })
}
  • 判斷傳入的參數是否為數組
let promiseRace = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要返回數組')
    }
    return new Promise((resolve, reject) => {
    })
}
  • 遍歷數組,再判斷數組中每個元素是否為Promsie對象的實例,再對此分情況處理
let promiseRace = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要返回數組')
    }
    return new Promise((resolve, reject) => {
        array.forEach((item) => {
            if (item instanceof Promise) {
                item.then(res => {
                    return resolve(res)
                },
                    err => reject(err))
            } else {
                return resolve(item)
            }
        })
    })
}

參考文檔

Promise 對象 – Promise.any()

以上就是Promise對象all與race方法手寫示例的詳細內容,更多關於Promise對象all race方法的資料請關註WalkonNet其它相關文章!

推薦閱讀: