/***
* 场景描述一
假设有100个ajax请求,每次发送3个请求,其中一个请求完毕,再加入新的请求,直到全部请求完毕
如果使用promsie.all,浏览器会瞬间发送100个请求,这样可能会造成请求阻塞、页面卡顿、甚至服务器崩溃,显然不合理;
那么就需要设计一个方案
*
*
*/
// 这个就是每次执行的异步请求方法,参数不一样
const fn = (t) => {
// 用setTimeout模拟异步请求
return new Promise((resolve, reject) => {
setTimeout(() => {
console.log('任务完成', t, new Date());
resolve({ t, date: new Date() });
}, t * 1000);
})
};
let arr = [1, 1, 1, 2, 2, 2, 3, 3, 3]
/**
* arrs 请求数据源数组
* limit 是每次并行发起多少个请求
* handleFn 就是异步处理函数
*/
function limitQueueFn(arrs, limit, handleFn) {
// 完成任务数
let index = 0;
// 第一次的时候 一次性执行 limit 个任务
for (let i = 0; i < limit; i++) {
run();
}
// 执行一个任务
function run() {
// 构造待执行任务 当该任务完成后 如果还有待完成的任务 继续执行任务
new Promise((resolve, reject) => {
const value = arrs[index];
index++; // 这个是同步操作
// resolve 返回 promise
resolve(handleFn(value))
}).then(() => {
if (index < arrs.length) {
run()
}
})
}
};
limitQueueFn(arr, 3, fn)
console