一步步手写Promise 2

then的基础构建

class MyPromise {
  static PENDING = "pending"
  static FULFILLED = "fulfilled"
  static REJECTED = "rejected"
  
  constructor(executor) {
    this.status = MyPromise.PENDING
    this.value = null
    
    try {
      executor(this.resolve.bind(this), this.reject.bind(this))
    } catch (e) {
      this.reject(e)
    }
  }
  
  resolve(value) {
    if (this.status === MyPromise.PENDING) {
      this.status = MyPromise.FULFILLED
      this.value = value
    }
  }
  
  reject(reason) {
    if (this.status === MyPromise.PENDING) {
      this.status = MyPromise.REJECTED
      this.value = reason
    }
  }
  
  then(onFulfilled, onRejected) {
    if (typeof onFulfilled !== "function") {
      onFulfilled = () => {
      }
    }
    if (typeof onRejected !== "function") {
      onRejected = () => {
      }
    }
    if (this.status === MyPromise.FULFILLED) {
      try {
        onFulfilled(this.value)
      } catch (e) {
        onRejected(e)
      }
    }
    if (this.status === MyPromise.REJECTED) {
      try {
        onRejected(this.value)
      } catch (e) {
        onRejected(e)
      }
    }
  }
}

  let p = new MyPromise((resolve, reject) => {
    // resolve("解决")
    reject("失败")
  }).then(value => {
    console.log(value)
  }, reason => {
    console.log("reason:"+reason);
  })
//reason:失败
</script>

对比原生Promise会发现MyPromise是同步执行的

<script>
  let p = new MyPromise((resolve, reject) => {
    resolve("MyPromise")
  }).then(value => {
    console.log(value);
  })
  console.log("111111111")
  
  let p2 = new Promise(resolve => {
    resolve("原生promise")
  }).then(value => console.log(value))
  
  console.log("22222222222")
  //MyPromise
  //111111111
  //22222222222
  //原生promise
</script>

将任务放到任务队列中

class MyPromise {
  static PENDING = "pending"
  static FULFILLED = "fulfilled"
  static REJECTED = "rejected"
  
  constructor(executor) {
    this.status = MyPromise.PENDING
    this.value = null
    
    try {
      executor(this.resolve.bind(this), this.reject.bind(this))
    } catch (e) {
      this.reject(e)
    }
  }
  
  resolve(value) {
    if (this.status === MyPromise.PENDING) {
      this.status = MyPromise.FULFILLED
      this.value = value
    }
  }
  
  reject(reason) {
    if (this.status === MyPromise.PENDING) {
      this.status = MyPromise.REJECTED
      this.value = reason
    }
  }
  
  then(onFulfilled, onRejected) {
    if (typeof onFulfilled !== "function") {
      onFulfilled = () => {
      }
    }
    if (typeof onRejected !== "function") {
      onRejected = () => {
      }
    }
    if (this.status === MyPromise.FULFILLED) {
      setTimeout(() => {
        try {
          onFulfilled(this.value)
        } catch (e) {
          onRejected(e)
        }
      })
    }
    if (this.status === MyPromise.REJECTED) {
      setTimeout(() => {
        try {
          onRejected(this.value)
        } catch (e) {
          onRejected(e)
        }
      })
    }
  }
}