爲Promise添加一個方法

    Promise在JS中可以說有着舉足輕重的地位,很早之前就看了很多Promise的文章和書籍,記得在一篇文章中看到過Promise的list方法(作用下邊有詳細介紹)還做了筆記,但是,在使用的時候卻發現現在的JS標準(ES6)不支持list方法,所以,就自己寫一個吧!哈哈哈哈哈

Promise.list():

作用將多個Promise對象包裝成一個新的Promise對象,並行運行多個Promise對象,所有Promise對象結束觸發then事件。主要功能:若有Promise對象出錯(list方法的重點),則包裝爲

{ error: "error msg" }    // 錯誤信息

正確則返回結果。

示例

var p = Promise.list([p1,p2,p3]);

p.then(function(values) {
    // values爲[{p1的結果},{p2的結果},{p3的結果}]
})

接受參數一個數組,數組每一項爲Promise對象,如p1、p2、p3。

返回結果一個數組,順序排列每一項的結果。

實現

// 原始版
if (!Promise.list) {
    Promise.list = function (jobArr) {
        let jobsResult = [];
        jobArr.forEach(function (job) {

            // 運行數組內的Promise對象,出現錯誤包裝爲{"error": reason}
            jobsResult.push(job.then(function (value) {
                return value;
            }).catch(function (reason) {
                return {"error": reason};
            }));
        })

        // 用Promise.all包裝爲一個新的Promise對象
        return Promise.all(jobsResult);
    }
}

// 精簡版
if (!Promise.list) {
    Promise.list = list => Promise.all( list.map( item => item.then(val => ({val})).catch(err => ({err}))));
}


使用示例:

// 添加Promise.list方法
if (!Promise.list) {
    Promise.list = function (jobArr) {
        let jobsResult = [];
        jobArr.forEach(function (job) {
            jobsResult.push(job.then(function (value) {
                return value;
            }).catch(function (reason) {
                return {"error": reason};
            }));
        })
        return Promise.all(jobsResult);
    }
}

// 創建一個數組,每一項爲Promise對象
var pArr = [1, 2, 3, 4].map(function (value) {
    if (value == 3) {    // 第三個設置爲會出錯的Promise對象
        return createPromise(0);
    } else {
        return createPromise(1);
    }
})

// 創建Promise對象的方法,returnStatus爲1返回正確的Promise對象,其他則返回錯誤的Promise對象
function createPromise(returnStatus) {
    return new Promise(function (reslove, reject) {
        if (returnStatus == 1) {
            reslove({data: "success"});
        } else {
            reject("failed");
        }
    });
}

// 調用Promise.list()方法
Promise.list(pArr).then(function (value) {
    console.log("value:", value);    // 第三個會返回錯誤信息:[ { data: 'success' },{ data: 'success' },{ error: 'failed' },{ data: 'success' } ]
}).catch(function (reason) {
    console.log("error:", reason);
})
總結歡迎指教。哈哈哈哈哈
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章