从实现一个Promise说起

const p = new Promise((resolve, reject) => {
  console.log('A')
  setTimeout(() => {
    console.log('B')
    resolve('C')
  })
})

p.then(res => {
  console.log(res)
})

// A B C D

interface IPromise {
  status: STATUS // 表明当前Promise的状态，不可逆，在进行then添加方法时，会根据这个状态做出不同的处理
  value: any // 异步函数执行成功后返回的值
  reason: any // 异步函数执行失败后返回的值
  onResolvedCallbacks: Function[] // 保存then方法添加的成功后执行函数
  onRejectCallbacks: Function[] // 保存then方法添加的失败后的执行函数
}

enum STATUS {
  PENDING,
  FULFILLED,
  REJECTED
}

class MyPromise {
  private status: STATUS
  private value: any
  private reason: any
  private onResolvedCallBacks: Function [] = []
  private onRejectCallBacks: Function [] = []

  constructor(executor: Function) {
    const self = this
    function resolve(value: any) {
      // 改变当前Promise的状态
      if (p.status === STATUS.PENDING) {
        p.stats = STATUS.FULFILLED
        p.value = value
        p.onResolveCallbacks.forEach(fun => {
          fun(p.value)
        })
      }
    }
    function reject(reason: any) {
      if (p.status === STATUS.PENDING) {
        p.status = STATUS.REJECTED
        p.reason = reason
        p.onRejectCallbacks.forEach(fun => fun(reason))
      }
    }
  }

  public then(onFulfilled: Function, onReject?: Function) {
    this.onResolveCallbacks.push(onFulfilled)
    if (onReject) {
      this.onRjectCallback.push(onRject)
      return
    }
    return this
  }
}

function reject (value: any) {
  // 调用setImmediate方法，保证resolve一定会在通过then同步的注册的方法后调用
  // setImmediate将会把回调中的函数加入到下一个task，优先级要比setTimeout高
  // JS中的Promise.resolve方法时将回调中的函数加入到当前的microtask队列，优先级要比前者高
  setImmediate(() => {
    if (p.status === STATUS.PENDING) {
      p.stats = STATUS.FULFILLED
      p.value = value
      p.onResolveCallbacks.forEach(fun => {
        fun(p.value)
      })
    }
  })
}

public then (onFulfilled: Function, onReject?: Function) {
  // 包装一个Promise
  let promise2: MyPromise
  // 保存当前this——外部的Promise
  const self: MyPromise = this
  // 如果当前异步函数执行成功，得到了值
  if (this.status === STATUS.FULFILLED) {
    // 声明一个新的 promise2
    promise2 = new MyPromise((resovle, reject) => {
      setImmediate(() => {
        try {
          // then添加的方法返回一个promise
          let res = onFulfilled(self.value)
          resolvePromise(promise2, res, resovle, reject)
        } catch (error) {
          reject(error)
        }
      })
    })
  }

  if (this.status === STATUS.PENDING) {
    promise2 = new MyPromise((reslove, reject) => {
      self.onResolveCallbacks.push(value => {
        try {
          let res = onFulfilled(value)
          resolvePromise(promise2, res, reslove, reject)
        } catch (error) {
          reject(error)
        }
      })
      self.onRejectCallbacks.push(reason => {
        try {
          let res = onReject(reason)
          resolvePromise(promise2, res, reslove, reject)
        } catch (error) {
          reject(error)
        }
      })
    })
  }

  function resolvePromise (promise: MyPromise, res: any, resolve: Function, reject: Function) {
    // 暂时不清楚什么情况下会出现循环应用
    if (promise === res) {
      return reject(new TypeError('循环引用'))
    }
    let then
    let called
    
    // 如果onFulfilled方法返回的res不为空，并且可能是object（可能是一个Promise或者一般对象）或者function
    if (res !== null && ((typeof res === 'object' || typeof res === 'function'))) {
      try {
        then = res.then
        // 如果res具有then属性，并且是一个function，说明可能是一个Promise(这里应该用类型判断)
        if (typeof then === 'function') {
          // 重复调用then方法, 直到res不再是一个Promise
          then.call(res, function (res2) {
            // 每次调用then方法都会返回一个新的Promise，如果当前的Promise已经注册过事件了，将会直接return
            if (called) return
            called = true
            resolvePromise(promise, res2, resolve, reject)
          }, function (err) {
            if (called) return
            called = true
            reject(err)
          })
        } else {
          // 调用resolve
          resolve(res)
        }
      } catch (error) {
        if (called) return
        called = true
        reject(error)
      }
    } else {
      resolve(res)
    }
  }
  
  return promise2
}