手写promise

//三种状态
const PENDING = 'pending' // 等待
const FUlFILLED = 'fulfilled' //成功
const REJECTED = 'rejected' //失败
 
//定义MyPromise类
class MyPromise{
  //在构造函数,定义一个执行器,实例化对象时立即执行
  constructor(executor){
    try {
      executor(this.resolve,this.reject)
    } catch (error) {
      this.reject(e)
    }
  }
  //定义初始状态为等待
  status = PENDING;
  //定义成功返回值
  value = undefined;
  //定义失败原因
  reason = undefined;
  //初始化成功函数 ,后续会出现多次调用,定为数组
  successCallback = [];
  //初始话失败函数
  failCallback = [];
  //定义resolve函数:更改状态为成功,使用箭头函数,使的this指向实例化对象而非window或undefined
  resolve = value =>{
    //一旦更改状态不可再次修改
    if(this.status !== PENDING) return;
    this.value = value;//存储value到当前内存中
    this.status = FUlFILLED;//更改状态为成功状态
    while (this.successCallback.length){
      //判断成功回调是否存在 如果存在 调用
      this.successCallback.shift()(this.value);
    }
  }
  //定义rejected函数:更改状态为失败
  reject = reason =>{
    if(this.status !== PENDING) return;
    this.reason = reason;//存储value到当前内存中
    this.status = REJECTED;//更改为失败状态
    while (this.failCallback.length){
      //判断成功回调是否存在 如果存在 调用
      this.failCallback.shift()(this.reason);
    }
  }
  //定义then方法,有两个回调函数,分别时成功回调successCallBack,失败回调failCallBack
  then = (successCallback,failCallback) =>{
    //将then的方法参数编程可选参数
    successCallback = successCallback?successCallback:value =>value;//普通值或回调函数
    failCallback && failCallback?failCallback:reason =>{throw reason};//回调函数或抛出异常
    //链式调用 ,将值给下一个then方法,而then接收的时promise对象
    //实例化另一个promise2对象,并将函数放入执行器中立即调用
    //根据调用的时resolve还是reject执行相应的回调函数
    let promise2 = new MyPromise((resolve,reject) => {
      if(this.status === FUlFILLED){//成功执行
        //因为promise2是执行完之后才能实例化得到,promise2正在执行中获取不到,将其变成异步函数进行获取
        setTimeout(() =>{
          //将当前参数复制给回调函数,
          //由于传入值可能是普通值或者是promise对象
          //如果是普通值,直接调用promise
          //如果是promise对象 调用then查看promise对象返回的状态,判断是调用reslove还是reject
          try {//捕获上一个promise执行then回调方法可能会出现的异常
            let x = successCallback(this.value);
            reslovePromise(promise2,x,reslove,reject);
          } catch (error) {
            
          }
        },0)
      }else if(this.status === REJECTED){//失败
        setTimeout(() =>{
          try {
              //将当前原因给失败回调函数
              let x = failCallback(this.reason);
              reslovePromise(promise2,x,reslove, reject);
          } catch (error) {
            
          }
        },0)
      }else{//存在异步回调,等待异步函数执行完
        //将成功回调和失败回调存储起来
        this.successCallback.push(() =>{
          setTimeout(() =>{
            try {
              let x = successCallback(this.reason);
              reslovePromise(promise2,x,reslove, reject);
            } catch (error) {
              
            }
          },0)
        }); 
        this.failCallback.push(() => {
          setTimeout(() =>{
            try {
              let x = failCallback(this.reason);
              reslovePromise(promise2,x,reslove, reject);
            } catch (error) {
              
            }
          },0)
        }); 
      }
    })
    return promise2;
  }
  //不管成功还是失败最后都会执行一次,后面调用then方法拿到最后的值
  finally (callback) {
    return this.then(value => {
      //调用MyPromise的resolve的方法,不管是同步还是异步的回调方法,都当做promise函数返回
      return MyPromise.resolve(callback()).then((value)=>value)
    },reason =>{
      return MyPromise.resolve(callback()).then(()=>{throw reason})
    })
  }
  //then第二个参数不调用reject回调函数,直接在最后一次调用catch捕获异常
  catch(failCallback){
    return this.then(undefined,failCallback)
  }
  //静态方法,无须实例化调用,可直接Promise.all()
  //all传入数组,只有都执行完才往下执行then方法
  static all (array) {
    let result = [];//存储已经执行
    let index = 0;//记录值
    //最后返回的promise对象
    return new MyPromise((resolve,reject) =>{
      function addData (key, value) {
        index++;
        result[key] = value;
        //防止数组中存在异步函数,存在,等待异步函数执行完
        if(array.length === index){//如果执行的数组都执行了,则长度等于记录值,往下执行
          reslove(result);
        }
      }
      //循环调用
      for(let i = 0; i <array.length; i++){
        let current = array[i];
        if(current instanceof Mypromise){
          current.then(value => addData(i,value),(reason) => reject(reason))
        }else{
          //普通值
          addData(i,array[i])
        }
      }
      if(array.length === index){
        reslove(result);
      }
    })
  }
  //直接调用Promise.resolve()更改状态
  static  reslove (value){
    //传入值是promise对象
    if(value instanceof Mypromise){
      return new Mypromise(resolve => resolve(value))
    }else{//普通值直接返回
      return value;
    }
  }
}
function reslovePromise(promise2,x,reslove,reject){
  if(promise2 === x){//返回自身
    //意思是链式调用自己
    return reject(new TypeError('Chaining cycle detected for promise #<Promise>'))
  }
  //判断x是否是MyPromise的实例
  if(promise2 instanceof x){//通过原型判断是自己
    //说明是promise对象,调用then方法查看promise状态
    x.then(reslove,reject);
  }else{
    //普通值
    reslove(x);
  }
}
module.exports = MyPromise;
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,948评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,371评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,490评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,521评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,627评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,842评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,997评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,741评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,203评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,534评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,673评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,339评论 4 330
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,955评论 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,770评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,000评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,394评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,562评论 2 349

推荐阅读更多精彩内容