SOURCE

  /***
   * 场景描述一
假设有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 命令行工具 X clear

                    
>
console