首页 > 其他分享 >使用typescript实现Promise

使用typescript实现Promise

时间:2023-04-25 09:11:27浏览次数:27  
标签:status Function typescript 实现 res MyPromise Promise error pending

/**
 * @name         MyPromise
 * @description  简单实现Promise
 * @author       ****
 */
class MyPromise<T> {
  //存放成功的回调函数
  private resolveFn: Function = () => {};
  //存放失败的回调函数
  private rejectFn: Function = () => {};
  // 当前的状态
  // 有三种状态 pending 为初始状态 pending 状态一旦修改 无法在进行改变
  private status: string = "pending";
  // 存放传入的值
  private value: any;
  // race的状态
  static raceStatus: string = "pending";

  constructor(props: Function) {
    //修改this指向 将this实例后的实体
    props(this.resolve.bind(this), this.reject.bind(this));
  }
  /**成功的方法 用于修改状态和值  异步成功以后 将then 传进来的回调 进行调用 */
  public resolve(value: string | object | Array<any>, isRace: boolean) {
    if (MyPromise.raceStatus === "pending" && isRace)
      MyPromise.raceStatus = "success";
    if (this.status === "pending")
      (this.value = value), (this.status = "success");
    // if (this.status === "pending")this.status = "success" ;
    if (this.status === "success") this.resolveFn(this.value);
  }
  /**失败的方法 用于修改状态和值  异步失败以后 将cath 传进来的回调 进行调用 */
  public reject(value: string | object | Array<any>, isRace: boolean) {
    if (MyPromise.raceStatus === "pending" && isRace)
      MyPromise.raceStatus = "error";
    if (this.status === "pending") this.value = value;
    if (this.status === "pending") this.status = "error";
    if (this.status === "error") this.rejectFn(this.value);
  }
  /**存储成功或失败的回调函数 return this 实现链式调用  存储函数 异步调用*/
  public then(success: Function, error?: Function) {
    if (this.status === "success") {
      success(this.status);
    } else if (this.status === "pending") {
      this.resolveFn = success;
    }
    if (this.status === "error" && error) {
      error(this.value);
    } else if (this.status === "pending" && error) {
      this.rejectFn = error;
    }
    return this;
  }
  /**存储成功或失败的回调函数 return this 实现链式调用  存储函数 异步调用*/
  public catch(error: Function) {
    if (this.status === "error") error(this.value);
    return this;
  }
  /**
   * @description 将 Promise数组 所有的 都完成以后 回调
   * @param    {Array} arr   Promise 的 数组
   * @returns  {Promise}
   */
  static all(arr: Array<MyPromise<any>>) {
    let resArr: Array<any> = [];
    return new MyPromise((resolve: Function, reject: Function) => {
      arr.forEach((item) => {
        item.then(
          (res: any) => {
            resArr.push(res);
            if (resArr.length === arr.length) {
              resolve(resArr);
            }
          },
          (err: any) => {
            reject(err);
          }
        );
      });
    });
  }
  // 静态属性不用实例直接调用  Mypromise.resolve("123")
  static resolve() {
    // return this;
  }
  // 静态属性不用实例直接调用  Mypromise.reject("123")
  static reject() {
    // return this;
  }
  /**
   * @description Promise 数组 最先完成的那个进行回调
   * @param  {Array} arr   Promise 的 数组
   * @returns {Promise} Promise
   */
  static reace(arr: Array<MyPromise<any>>) {
    return new MyPromise((resolve: Function, reject: Function) => {
      arr.forEach((item) => {
        item.then(
          (res: any) => {
            if (MyPromise.raceStatus === "pending") resolve(res, true);
          },
          (err: any) => {
            if (MyPromise.raceStatus === "pending") reject(err, true);
          }
        );
      });
    });
  }
}

(function () {
  let a: MyPromise<string> = new MyPromise(
    (resolve: Function, reject: Function) => {
      setTimeout(() => {
        resolve("结果");
        // reject("失败");
      }, 1000);
    }
  );
  a.then(
    (res: any) => {
      console.log(res);
    },
    (err: any) => {
      console.log(err);
    }
  );

  let p1: MyPromise<String> = new MyPromise((res: Function, rej: Function) => {
    setTimeout(() => {
      res("快的结果");
    }, 1000);
  });
  let p2: MyPromise<String> = new MyPromise((res: Function, rej: Function) => {
    setTimeout(() => {
      res("慢的结果");
    }, 10000);
  });
  MyPromise.all([p1, p2]).then((res: Array<any>) => {
    console.log(res);
  });
  MyPromise.reace([p1, p2]).then((res: any) => {
    console.log(res);
  });
})();

标签:status,Function,typescript,实现,res,MyPromise,Promise,error,pending
From: https://www.cnblogs.com/JsDreamer/p/17351600.html

相关文章

  • listwidget 实现横向流式排布关键以及过滤注意事项
    listWidget里面设置以下属性:this->setViewMode(QListView::IconMode);this->setResizeMode(QListView::Adjust);this->setMovement(QListView::Static);流式排布过滤时需要注意:在流式排布中过滤item采用隐藏的方式时,因为采用的是IconMode模式,所以偶尔会出现排版......
  • 利用Arduino制作音乐播放+随节奏闪光仪器实现
    1.实验器材Arduino开发板,面包板一块,杜邦线若干,LED灯若干,220欧电阻若干,蜂鸣器一个。2.实验操作将六个led灯的正极依次接到arduino板I/O接口的2-7口,电源负极依分别接一个220欧的电阻。整体负极接arduino板的GND接口。蜂鸣器正极接arduino板I/O接口的8口,负极接GND。3.代码......
  • 【无人机三维路径规划】基于遗传算法实现无人机航迹规划附matlab代码
    ✅作者简介:热爱科研的Matlab仿真开发者,修心和技术同步精进,matlab项目合作可私信。......
  • 数据库校验用户准备工作与数据库校验用户核心代码实现
    数据库校验用户准备工作实现数据库检验用户从之前的分析我们可以知道,我们可以自定义一个UserDetailsService,让SpringSecurity使用我们的UserDetailsService。我们自己的UserDetailsService可以从数据库中查询用户名和密码。......
  • 斯坦福 UE4 C++ ActionRoguelike游戏实例教程 16.优化交互,实现看到物体时出现交互提
    斯坦福课程UE4C++ActionRoguelike游戏实例教程0.绪论概述本篇文章对应Lecture18–CreatingBuffs,WorldInteraction,73节。本文将会重构以前实现过的SurInteractionComponent,实现在玩家注释可交互物体时,可以出现可交互提示,效果如下:在文章的最后,我会放出所有相关的代......
  • C#实现应用不重复开启
    privatevoidFormMain_Load(objectsender,EventArgse){if(CheckRunning("程序名"))//设定程序禁止重复运行,并返回检查当前进程是否重复开启的实例的结果。"identifier"不能与其它程序一样,这是区分互斥所的标识符。{Process.GetCurrentProcess().Kill();//关掉当前进......
  • SpringSecurity从入门到精通:登录接口代码实现&测试接口
    登录接口代码实现 @RestController @RestControllerpublicclassLoginController{@AutowiredprivateLoginServcieloginServcie;@PostMapping("/user/login")publicResponseResultlogin(@RequestBodyUseruser){returnloginServ......
  • 面试最常问的数组转树,树转数组 c++ web框架paozhu实现
    刚毕业同学,找工作常被问二维数组转树,树转二维数组需要支持无限层级实现,如果你了解这个语言那么实现起来还要一番思考c++web框架paozhu使用需要实现数据库表数据到前台菜单实现,就是这种功能二维数组转树,树转二维数组保存时候树二维数组,展示时候树树状。这个技术难点在于无......
  • 百度编辑器 实现ctrl+v粘贴图片并上传、word粘贴带图片
    ​ 百度ueditor新增的将word内容导入到富文本编辑框的功能怎么没有啊,...ueditor实现word文档的导入和下载功能的方法:1、UEditor没有提供word的导入功能,只能说是粘贴复制。2、方案:用poi来提供word导入,思路是将word转换为html输出,再用UEditor提供的setContent()方法将html的内容......
  • js 实现继承
    一、使用原型链functionAnimal1(leg){this.leg=leg;}functionDog1(name){this.name=name;Animal1.call(this,4)//!!import1}Dog1.prototype.__proto_......