JS實現批量併發請求

要求:實現一個批量請求函數 multiRequest(urls, maxNum),要求最大併發數 maxNum,每當有一個請求返回,就留下一個空位,可以增加新的請求,所有請求完成後,結果按照 urls 裏面的順序依次打出。

// 模擬ajax請求
function majax(url) {
    return new Promise((resolve, reject)=>{
        setTimeout(() => {
            const res = {
                req: url,
                res: `迴應:${url}`
            }
            resolve(res);
        }, Math.floor(Math.random() * 1000) + 600);
    })
}

// 批量請求切控制併發數
function multiRequest(urls, maxNum) {
    return new Promise((resolve, reject) => {
        let _urls = [...urls]
        let _ress = {}
        let stackNum = 0;
        let _rsl = [];
        // 添加一個新的請求
        let addXhr = function () {
            // 隊列已滿或沒有待請求
            if (stackNum >= maxNum || _urls.length == 0) return;
            const __path = _urls.shift();
            stackNum ++;
            console.log(`${__path} begin!`)
            majax(__path).then(res => {
                _ress[__path] = res;
                console.log(`${__path} over!`)
                stackNum --;
                if (stackNum == 0 && _urls.length == 0) {
                    // 所有請求全部返回完畢
                    for (let i=0;i<urls.length;i++) {
                        _rsl.push(_ress[urls[i]])
                    }
                    resolve(_rsl);
                } else {
                    addXhr();
                }
            })
        }

        while (stackNum < maxNum) {
            addXhr();
        }
    })
}

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章