promise和setTimeout的执行顺序

直接上一段手写的promise给大家分享做个了解

class Commitment {
  static PADDING = '待定'; static RESOLVE = '成功'; static REJECT = '失败';
  constructor(func) {
    this.status = Commitment.PADDING;
    this.result = null;
    this.resolveCallback = [];
    this.rejectCallback = [];

    try {
      func(this.resolve.bind(this), this.reject.bind(this));  
    } catch (error) {
      this.reject(error);
    }
   
  }

  resolve(result) {
    setTimeout(() => {
      if (this.status === Commitment.PADDING) {
        this.status === Commitment.RESOLVE;
        this.result = result;
        this.resolveCallback.forEach((onResolve) => onResolve(result));
      }
    }); 
  }

  reject(result) {
    setTimeout(() => {
      if (this.status === Commitment.PADDING) {
        this.status === Commitment.REJECT;
        this.result = result;
        this.rejectCallback.forEach((onReject) => onReject(result));
      }
    });
  }

  then(onResolve, onReject) {
    return new Commitment((resolve, reject) => {
      onResolve = typeof onResolve === 'function' ? onResolve : () => {};
      onReject = typeof onReject === 'function' ? onReject : () => {};
  
      if (this.status === Commitment.PADDING) {
        this.resolveCallback.push(onResolve);
        this.rejectCallback.push(onReject);
      }
  
      if (this.status === Commitment.RESOLVE) {
        setTimeout(() => onResolve(this.result));
        
      }
  
      if (this.status === Commitment.REJECT) {
        setTimeout(() => onReject(this.result));
      }
    })
  }
}

下面举个例子：

console.log('第一');

setTimeout(() => {
  console.log('第五');
}, 0);

new Promise((resolve) => {
  console.log('第二');
  resolve();
}).then(() => {
  console.log('第四');
});

console.log('第三');

这里的输出顺序是：
第一
第二
第三
第四
第五
考验的还是事件循环，吃透了事件循环的同学会马上晓得，代码自上而下，遇见同步任务执行，遇见异步任务进入任务队列排队，如果有script，那就是宏任务先行，微任务后执行；如若没有，那就是微任务优先于宏任务先执行，setimeout属于宏任务，promise在没有任何内部方法下执行时属于同步任务，里面的内部方法属于异步任务中的微任务。