ES6

ES6 Promise all 和race的区别与实现

2020-01-19  本文已影响0人  AvenKe

Promise 是ES6语法标准里的新定义,一般用来处理异步方法的同步执行。本文主要介绍Promise all和race的用法和实现。

区别:

promise all是等所有异步方法返回结果之后再继续后面操作,而 race是指哪个方法先最先结束,就返回该方法的结果。前者返回的是包含所有结果的数组,race返回的是最先执行结束并返回的那一个结果。

实现 all

加入有以下场景:我有5个异步方法,需要等到这5个方法执行结束之后再执行下一步,如果其中有一个出错,则进入到catch方法里。具体实现如下:

function promiseAll(arr){
    return new Promise((resolve, reject) => {
        const result = [];
        let i = 0;
        function next(promise){
            if( i > arr.length - 1){
                return resolve(result);
            }
            promise().then(res => {
                const end = new Date().valueOf();
                const diff = end - start;
                console.log(i, diff)
                result.push(res);
                next(arr[++i]);
            }).catch(err => {
                return resolve(err);
            })
        }
        next(arr[i]);
    });
};

const promiseList = [1,2,3,4,5].map(one => {
    return () => {
         return new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve(one);
            }, 1000);
        })
    }
});

const start = new Date().valueOf();
promiseAll(promiseList).then(res => {
    const end = new Date().valueOf();
    console.log(res, end - start)
});
// [1, 2, 3, 4, 5] 15000

对性能要求比较高的朋友会发现,这个是一个一个按顺序执行的,而且如果传进去的数组元素不是promise的话,会报错(没有then方法)。
并发执行实现方式如下:

function promiseAll(arr){
    const result = [];
    return new Promise((resolve, reject) => {
        for(let i = 0; i < arr.length; i++){
            let p = arr[i];
            if(p instanceof Promise){   
            } else {
              p = Promise.resolve(p);
            }
            p.then((res) => {
                result[i] = res;
            }).catch(err => {
                return reject(err);
            })
        }
        return resolve(result);
    })
}
const input = [1,2,3,4,5];
promiseAll(input).then(res => {
    console.log(res);
}).catch(error => {
    console.log(error);
})

实现race:

(() => {
    function race(promises){
        return new Promise((resolve, reject) => {
            for(let i = 0; i < promises.length; i ++){
                let promise = promises[i];
                if(!(promise instanceof Promise)){
                    promise = Promise.resolve(promise);
                }
                promise.then(res => {
                    return resolve(res);
                }).catch(error => {
                    return reject(error);
                })
            }
        })
    }
    const p1 = () => {
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve(1)
                }, 2000)
            })
        };
    const p2 = () => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve(2)
            }, 1000)
        })
    }
    race([p1(), p2()]).then(res => {
        console.log("res", res) //2
    })
})()
上一篇下一篇

猜你喜欢

热点阅读