牛客--手写Promise.all和Promise.race

1.Promise.all的特点

1.将多个Promise实例包装成一个新的Promise实例

2.当参数所有promise全部成功时返回成功结果,且结果是所有promise返回成功结果的数数组

3.只要数组中有一个promise失败,则返回失败,结果是第一个失败的promise的值

使用场景:一共三个接口,我们需要拿到前两个接口返回的数据作为第三个接口的参数,需要使用promise.all将前两个接口作为promise传入Promise.all中,如果有一个失败了,就不会调用第三个接口

例子:

 

手写promise.all

<script>
      function promiseAll(promises) {
        return new Promise(function (resolve, reject) {
          // 判断传入的参数是否为数组
          if (!Array.isArray(promises)) {
            throw new Error("ssss");
          }
          // 判断多个Promise都是fulfilled状态,引入计数器
          var resolveCount = 0;
          //创建一个空数组,长度为传入数组的长度
          var promiseNum = promises.length;
          var resolveValues = new Array(promiseNum);
          //遍历传入的数组
          for (let i = 0; i < promiseNum; i++) {
            //  我们期望传入的数组都是Promise,所以先用Promise.reslove包裹
            Promise.resolve(promises[i]).then(
              function (value) {
                // 因为当前只接收fulfilled状态的Promise所以会走then
                resolveCount++;
                //将当前返回值存储到空数组里  这个空数组是最终Promise.all的reslove的值
                resolveValues[i] = value;
                if (resolveCount == promiseNum) {
                  return resolve(resolveValues);
                }
              },
              //如果有一个Promise的状态是rejected,会走下面的代码
              function (reason) {
                return reject(reason);
              }
            );
          }
        });
      }

      var Promise1 = Promise.reject(123);
      var Promise2 = new Promise(function (resolve, reject) {
        setTimeout(resolve, 100, "foo");
      });
      var Promise3 = 42;
      promiseAll([Promise1, Promise2, Promise3])
        .then((result) => {
          console.log(result);
        })
        .catch((error) => {
          console.log(error);
        });
    </script>

2.Promise.race

promise.race使用:Promise.race([p1,p2,p3])里面哪个结果获得的快,就返回那个结果

不管结果本身是成功状态还是失败状态

 <script>
      let p1 = new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve("success");
        }, 1000);
      });
      let p2 = new Promise((resolve, reject) => {
        setTimeout(() => {
          reject("failed");
        }, 500);
      });

      function promiserace(promises) {
        if (!Array.isArray(promises)) {
          throw new Error("promise must be an array");
        }
        return new Promise(function (resolve, reject) {
          promises.forEach((p) => {
            //遍历Promise 无论reslove还是rejected都会改变最外层的Promise的状态
            // 一旦状态拿到了 就定格不变了
            Promise.resolve(p).then(
              (data) => {
                resolve(data);
              },
              (err) => {
                reject(err);
              }
            );
          });
        });
      }

      promiserace([p1, p2])
        .then((result) => {
          console.log(result);
        })
        .catch((error) => {
          console.log(error);
        });
    </script>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值