[JavaScript知识库]手写一个promise.all

有时间把限制并发加上

<script>
    let p1 = new Promise(function (resolve, reject) {
      // console.log('执行 p1');
      setTimeout(function () {
        // console.log('执行完成 p1');
        resolve('p1-成功');
      }, );
    });
    let p2 = new Promise(function (resolve, reject) {
      // console.log('执行 p2');
      setTimeout(function () {
        // console.log('执行完成 p2');
        resolve('p2-成功');
      }, 1000);
    });
    let p3 = new Promise(function (resolve, reject) {
      // console.log('执行 p3');
      setTimeout(function () {
        // console.log('执行完成 p3');
        resolve('p3-成功');
      }, 1200);
    });
    let p4 = new Promise(function (resolve, reject) {
      // console.log('执行 p4');
      setTimeout(function () {
        // console.log('执行完成 p4');
        resolve('p4-成功');
      }, 1400);
    });
    let p5 = new Promise(function (resolve, reject) {
      // console.log('执行 p5');
      setTimeout(function () {
        // console.log('执行完成 p5');
        resolve('p5-成功');
      }, 4000);
    });
    let p6 = new Promise(function (resolve, reject) {
      // console.log('执行 p6');
      setTimeout(function () {
        // console.log('执行完成 p6');
        resolve('p6-成功');
      }, 4000);
    });
    let p7 = new Promise(function (resolve, reject) {
      // console.log('执行 p7');
      setTimeout(function () {
        // console.log('执行完成 p7');
        resolve('p7-成功');
      }, 4000);
    });
    let p8 = new Promise(function (resolve, reject) {
      // console.log('执行 p8');
      setTimeout(function () {
        // console.log('执行完成 p8');
        resolve('p8-成功');
      }, 4000);
    });
    let p9 = new Promise(function (resolve, reject) {
      // console.log('执行 p9');
      setTimeout(function () {
        // console.log('执行完成 p9');
        resolve('p9-成功');
      }, 4000);
    });
    let p10 = new Promise(function (resolve, reject) {
      // console.log('执行 p10');
      setTimeout(function () {
        // console.log('执行完成 p10');
        resolve('p10-成功');
      }, 4000);
    });

    let p11 = new Promise(function (resolve, reject) {
      // console.log('执行 p11');
      setTimeout(function () {
        // console.log('执行完成 p11');
        reject('p11-成功');
      }, 4000);
    });
    let pArr = [p1, p2, p3, p4, p5, p6, p7, p8, p9, p10, p11]


    function promiseAll(arr, limit = 5) { // 1. 接收?个 Promise 实例的数组
      if (!Array.isArray(arr)) {
        throw new Error('请传入数组')
      }
      let newArr = [...arr]
      let arrLength = arr.length
      let finish = 0; // 总共完成了几个Promise 请求
      let resArr = []; // 最后返回的数组
      let executing = []; // 剩余未完成 all


      return new Promise((resolve, reject) => { // 2. 返回?个新的 promise 对象
        newArr.forEach((item, index) => {

          Promise.resolve(item.then(res => { // 3.遍历传?的参数，?Promise.resolve()将参数"包?层"，使其变成?个promise对象
            finish++
            resArr.push({
              content: res,
              index
            })
            console.log(resArr)
            if (finish == arrLength) {
              resolve(resArr.sort((a, b) => a.index - b.index)) // 4. 参数所有回调成功才是成功，返回值数组与参数顺序?致
            }
          }).catch(err => {
            reject(err) // 5. 参数数组其中?个失败，则触发失败状态
          }))
        })
      })
    }
    promiseAll(pArr).then(res => {
      console.log('promiseAll 成功', res)
    }).catch(err => {
      console.log('promiseAll 失败', err)
    })
  </script>

创作打卡挑战赛

赢取流量/现金/CSDN周边激励大奖