使用Promise完成数据的限制并发请求

最新推荐文章于 2024-08-20 09:02:15 发布

进阶__前端

最新推荐文章于 2024-08-20 09:02:15 发布

阅读量1.1k

点赞数

分类专栏： javascript 面试文章标签： javascript

本文链接：https://blog.csdn.net/qq_38074118/article/details/115226306

版权

本文介绍了如何使用Promise和Promise.all来控制并发请求的数量，以避免瞬间大量请求导致的网络问题和内存溢出。通过创建一个PromisePool，将任务按限制的并发数分批执行，确保在所有任务完成后才执行后续操作。还提供了一个名为Parallel的函数实现，用于控制并发任务，当一个任务完成时，自动发起新的任务，直到所有请求完成。

摘要由CSDN通过智能技术生成

需求：需要保证代码在多个异步处理之后执行,我们通常会使用

Promise.all(promises: []).then(fun: function);

Promise.all可以保证，promises数组中所有promise对象都达到resolve状态，才执行then回调

那么会出现的情况是，你在瞬间发出几十万http请求（tcp连接数不足可能造成等待），或者堆积了无数调用栈导致内存溢出.

这个时候需要我们对HTTP的连接数做限制。

实现

//promise并发限制
class PromisePool {
    constructor(max, fn) {
        this.max = max; //最大并发量
        this.fn = fn; //自定义的请求函数
        this.pool = []; //并发池
        this.urls = []; //剩余的请求地址
    }
    start(urls) {
        this.urls = urls; //先循环把并发池塞满
        while (this.pool.length < this.max) {
            let url = this.urls.shift();
            this.setTask(url);
        }
        //利用Promise.race方法来获得并发池中某任务完成的信号
        let race = Promise.race(this.pool);
        return this.run(race);
    }
    run(race) {
        race
            .then(res => {
                //每当并发池跑完一个任务，就再塞入一个任务
                let url = this.urls.shift();
                this.setTask(url);
                return this.run(Promise.race(this.pool));
            })
    }
    setTask(url) {
        if (!url) return
        let task = this.fn(url);
        this.pool.push(task); //将该任务推入pool并发池中
        console.log(`\x1B[43m ${url} 开始，当前并发数：${this.pool.length}`)
        task.the