ES6系列——纯js手写一个异步操作(promise,async 函数),模拟请求接口

53 篇文章 0 订阅
2 篇文章 0 订阅

ES6系列——纯js手写一个异步操作(promise,async 函数),模拟请求接口

一、异步操作是什么?

异步模式不用阻塞当前线程来等待其他任务的完成,而是允许当前线程继续执行后面的操作,当异步操作完成后,再去执行回调操作,这样做的好处就是避免其他操作执行的时间太长而使当前线程长时间等待

二、使用步骤

1.promise

代码如下(示例):

samulation() {
      let promise = new Promise((resolve, reject) => {
        let ran = Math.ceil(Math.random() * 3),
        res = {
          code: undefined,
          massage: undefined,
          result: undefined,
        };
        if (ran === 1) {
          res.code = 200;
          res.massage = "成功";
          res.result = [{name:'阿巴阿巴'}]
          resolve(res);
        } else if (ran === 2) {
          res.code = 500;
          res.massage = "失败";
          res.result = null
          resolve(res);
        } else {
          setTimeout(() => {
            reject("ajax 请求失败");
          }, 1800000);
        }
      });
      promise.then(
        (res) => {
          //异步操作完,请求返回成功
          alert(res.massage)
        },
        (err) => {
          //异步操作完,请求返回失败报错
          alert(err)
        }
      );
    },

2.async 函数

代码如下(示例):

async samulation2() {
      let promise = function () {
        return new Promise((resolve, reject) => {
          let ran = Math.ceil(Math.random() * 3),
            res = {
              code: undefined,
              massage: undefined,
              result: undefined,
            };
          if (ran === 1) {
            res.code = 200;
            res.massage = "成功";
            res.result = [{ name: "阿巴阿巴" }];
            resolve(res);
          } else if (ran === 2) {
            res.code = 500;
            res.massage = "失败";
            res.result = null;
            reject(res);
          } else {
            setTimeout(() => {
              reject("ajax 请求超时");
            }, 1800000);
          }
        });
      };
      let res = await promise();
      if (res) {
        alert(res.massage);
      } else {
        alert(err);
      }
    },

总结

good afternoon
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值