欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

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

 更新時間:2022年12月11日 10:13:28   作者:大眼睛圖圖  
這篇文章主要為大家介紹了Promise對象all與race方法手寫示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪

前言

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

Promise.all

介紹

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

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

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

p的狀態(tài)由p1、p2p3決定,分成兩種情況。

(1)只有p1、p2、p3的狀態(tài)都變成fulfilled,p的狀態(tài)才會變成fulfilled,此時p1、p2、p3的返回值組成一個數(shù)組,傳遞給p的回調(diào)函數(shù)。

(2)只要p1、p2、p3之中有一個被rejected,p的狀態(tài)就變成rejected,此時第一個被reject的實例的返回值,會傳遞給p的回調(diào)函數(shù)。

手寫

  • 返回一個Promsie對象
const promiseAll = (array) => {
    return new Promise((resolve, reject) => {
    })
}
  • 判斷傳入的是數(shù)組
const promiseAll = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要傳入數(shù)組')
    }
    return new Promise((resolve, reject) => {
    }
}
  • 遍歷數(shù)組,再判斷數(shù)組中每個元素是否為Promsie對象的實例,并對此分情況處理
const promiseAll = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要傳入數(shù)組')
    }
    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
            }
        })
    })
}
  • 設(shè)置一個計數(shù)器count,當(dāng)遍歷完了所有數(shù)組里面的值,就把result數(shù)組打印出來
const promiseAll = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要傳入數(shù)組')
    }
    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]);

上面代碼中,只要p1p2、p3之中有一個實例率先改變狀態(tài),p的狀態(tài)就跟著改變。那個率先改變的 Promise 實例的返回值,就傳遞給p的回調(diào)函數(shù)。

手寫

  • 返回一個Promise對象
let promiseRace = (array) => {
    return new Promise((resolve, reject) => {
    })
}
  • 判斷傳入的參數(shù)是否為數(shù)組
let promiseRace = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要返回數(shù)組')
    }
    return new Promise((resolve, reject) => {
    })
}
  • 遍歷數(shù)組,再判斷數(shù)組中每個元素是否為Promsie對象的實例,再對此分情況處理
let promiseRace = (array) => {
    if (!Array.isArray(array)) {
        throw new Error('要返回數(shù)組')
    }
    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方法手寫示例的詳細內(nèi)容,更多關(guān)于Promise對象all race方法的資料請關(guān)注腳本之家其它相關(guān)文章!

相關(guān)文章

  • JS算法題之查找數(shù)字在數(shù)組中的索引位置

    JS算法題之查找數(shù)字在數(shù)組中的索引位置

    這篇文章主要給大家介紹了關(guān)于JS算法題之查找數(shù)字在數(shù)組中的索引位置的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家學(xué)習(xí)或者使用JS具有一定的參考學(xué)習(xí)價值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-05-05
  • js showModalDialog參數(shù)的使用詳解

    js showModalDialog參數(shù)的使用詳解

    本篇文章主要是對js中showModalDialog參數(shù)的使用進行了詳細的分析介紹,需要的朋友可以過來參考下,希望對大家有所幫助
    2014-01-01
  • Javascript 刷新全集常用代碼

    Javascript 刷新全集常用代碼

    Javascript刷新頁面實現(xiàn)代碼,需要的朋友可以參考下。
    2009-11-11
  • ES6知識點整理之Proxy的應(yīng)用實例詳解

    ES6知識點整理之Proxy的應(yīng)用實例詳解

    這篇文章主要介紹了ES6知識點整理之Proxy的應(yīng)用,結(jié)合實例形式詳細分析了ES6中Proxy的功能、原理、使用方法及相關(guān)操作注意事項,需要的朋友可以參考下
    2019-04-04
  • uniapp存儲數(shù)據(jù)到本地文件及讀取本地文件數(shù)據(jù)代碼示例

    uniapp存儲數(shù)據(jù)到本地文件及讀取本地文件數(shù)據(jù)代碼示例

    這篇文章主要給大家介紹了關(guān)于uniapp存儲數(shù)據(jù)到本地文件及讀取本地文件數(shù)據(jù)的相關(guān)資料,在開發(fā)uniapp應(yīng)用時,我們常常需要使用本地存儲來保存一些數(shù)據(jù),比如用戶登錄信息、設(shè)置項等,本文通過代碼介紹的非常詳細,需要的朋友可以參考下
    2023-09-09
  • javascript ajax 仿百度分頁函數(shù)

    javascript ajax 仿百度分頁函數(shù)

    百度分頁想必大家都知道吧,瀏覽網(wǎng)頁的朋友都應(yīng)該知道,下面有個小例子使用到了js、ajax等來模仿百度的分頁,感興趣的朋友可以參考下
    2013-10-10
  • JavaScript 拷貝賦值的具體使用

    JavaScript 拷貝賦值的具體使用

    在JavaScript編程中,經(jīng)常會涉及到對象賦值和拷貝的操作,本文主要介紹了JavaScript 拷貝賦值的具體使用,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2024-08-08
  • js鼠標經(jīng)過tab選項卡時實現(xiàn)切換延遲

    js鼠標經(jīng)過tab選項卡時實現(xiàn)切換延遲

    這篇文章主要為大家詳細介紹了js鼠標經(jīng)過tab選項卡時實現(xiàn)切換延遲效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-03-03
  • 微信小程序引入模塊中wxml、wxss、js的方法示例

    微信小程序引入模塊中wxml、wxss、js的方法示例

    這篇文章主要介紹了微信小程序引入模塊中wxml、wxss、js的方法示例,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-08-08
  • JavaScript實現(xiàn)多個物體同時運動

    JavaScript實現(xiàn)多個物體同時運動

    這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)多個物體同時運動,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2020-03-03

最新評論