手写极简版Promise
极简版Promise 满足的使用方式
- 生成实例对象的方式:
new MyPromise() - 通过类直接调用静态方法:
MyPromise.resolve(),目前静态方法仅支持resolve&reject 
亲测使用OK,欢迎指教,互相学习,github链接,欢迎star。
附赠利用构造函数手写Promise 的方法,github链接。
class MyPromise {
  constructor(fn) {
    // 定义Promise 三种状态
      this.states = {
          PENDING: 'PENDING', RESOLVED: 'RESOLVED', REJECTED: 'REJECTED'
      }
      // 定义传递到then的value
      this.value = null
      // 定义当前Promise运行状态
      this.state = this.states.PENDING
      // 定义Promise失败状态的回调函数集合
      this.resolvedCallBacks = []
      // 定义Promise成功状态的回调函数集合
      this.rejectedCallBacks = []
      // 为静态方法定义其内部使用的指向实例的that  
      MyPromise.that = this
      try {
      // 执行 new MyPromise() 内传入的方法
          fn(MyPromise.resolve, MyPromise.reject)
      } catch (error) {
          MyPromise.reject(this.value)
      }
  }
    // 静态resolve方法,MyPromise实例不可访问;
    //支持类MyPromise访问,例:MyPromise.resolve('success').then(e=>e)
  static resolve(value) {
      // 由于静态方法内部的this指向 类 而不是 实例,所以用下面的方法访问实例对象
      const that = MyPromise.that
      // 判断是否是MyPromise实例访问resolve
      const f = that instanceof MyPromise
      // MyPromise实例对象访问resolve
      if (f && that.state == that.states.PENDING) {
          that.state = that.states.RESOLVED
          that.value = value
          that.resolvedCallBacks.map(cb => (that.value = cb(that.value)))
      }
      // MyPromise类访问resolve
      if (!f) {
          const obj = new MyPromise()
          return Object.assign(obj, {
              state: obj.states.RESOLVED,
              value
          })
      }
  }
   // 静态reject方法,MyPromise实例不可访问;
   //支持类MyPromise访问,例:MyPromise.reject('fail').then(e=>e)
  static reject(value) {
      const that = MyPromise.that
      const f = that instanceof MyPromise
      if (f && that.state == that.states.PENDING) {
          that.state = that.states.REJECTED
          that.value = value
          that.rejectedCallBacks.map(cb => (that.value = cb(that.value)))
      }
      if (!f) {
          const obj = new MyPromise()
          return Object.assign(obj, {
              state: obj.states.REJECTED,
              value
          })
      }
  }
  // 定义在MyPromise原型上的then方法
  then(onFulfilled, onRejected) {
      const { PENDING, RESOLVED, REJECTED } = this.states
      const f = typeof onFulfilled == "function" ? onFulfilled : c => c;
      const r =
          typeof onRejected == "function"
              ? onRejected
              : c => {
                  throw c;
              };
      switch (this.state) {
          case PENDING:
              // ‘PENDING’状态下向回调函数集合添加callback
              this.resolvedCallBacks.push(f)
              this.rejectedCallBacks.push(r)
              break;
          case RESOLVED:
              // 将回调函数的返回值赋值给 实例的 value,满足链式调用then方法时传递value
              this.value = f(this.value)
              break;
          case REJECTED:
              // 同上
              this.value = r(this.value)
              break;
          default:
              break;
      }
      // 满足链式调用then,返回MyPromise实例对象
      return this
  }
}
MyPromise.resolve('success').then((e) => {
  console.log(e);
  return e + 1
}).then( res=> {
  console.log(res);
})
new MyPromise(resolve => {
  setTimeout(() => {
      resolve(1);
  }, 2000);
})
  .then(res1 => {
      console.log(res1);
      return 2;
  })
  .then(res2 => console.log(res2 )); 相关推荐
  88254251    2020-11-01  
   MarukoMa    2020-09-02  
   88234852    2020-09-15  
   陈旭阳    2020-08-31  
   whynotgonow    2020-08-19  
   前端开发Kingcean    2020-07-30  
   whynotgonow    2020-07-29  
   bowean    2020-07-08  
   前端开发Kingcean    2020-07-08  
   88520191    2020-07-05  
   前端开发Kingcean    2020-06-27  
   88481456    2020-06-18  
   whynotgonow    2020-06-16  
   88520191    2020-06-13  
   88520191    2020-06-13  
   89500297    2020-06-13