Promise为什么比setTimeout先执行?

结论

为什么立即解决的 promise 比立即执行定时器处理得更快？

由于事件循环优先级的存在，因此与任务队列(宏任务)（存储超时的setTimeout()回调）相比，作业队列(微任务)（用于存储已实现的Promise回调）的优先级更高。

现象

setTimeout(()=>{console.log(1)},0)
new Promise((resolve)=>{
  console.log(2)
  for(var i=0;i<10000;i++){
    i===9999&&resolve()//如果把resolve去掉，就一直处于pending状态
  }
  console.log(3)
}).then(()=>{
  console.log(4)
})
console.log(5)
// 2
// 3
// 5
// 4
// 1

基本概念

1、 进程与线程

• 进程(process):是操作系统结构的基础，是系统进行资源分配和调度的基本单位，比进程更小的单位就是线程
• 线程(thread):是操作系统能够进行运算调度的最小单位，它被包含在进程之中，是进程中的实际运作单位。一个进程可以并发多个线程，每条线程并行执行不同的任务
• 并发(concurrency):一个处理器同时处理多个任务
• 并行(parallelism):多个处理器或多核处理器同时处理多个任务
• 单线程：单线程在程序执行时，所走的程序路径按照连续顺序排下来，前面的必须处理好，后面的才会执行

2、 同步与异步

• 同步(synchronous):调用一旦开始，调用者必须等到调用结束才能执行下一步操作
• 异步(asynchronous):方法一旦调用，就会立即返回，调用者便可进行下一步操作

JS运行机制

• 执行栈:是一个存储函数调用的栈结构，遵循先进后出的原则

• 主线程:现在正在执行执行栈中的哪个事件

• Event Loop:JS执行往执行栈中放入函数，遇到异步会被挂起并在需要执行的时候加入到任务队列。一旦执行栈为空，Event Loop就会从任务队列中拿出需要执行的代码并放入执行栈中执行。 JS引擎常驻于内存中，等待宿主将JS代码或函数传递给它，也就是等待宿主环境分配宏观任务，反复等待–>执行 即为事件循环
  
  1、JS是单线程的，所有同步任务都会在主线程中执行
  2、当主线程中任务执行完之后，系统会’依次’读取任务队列里的事件。与之相对应的异步任务进入主线程，开始执行。
  3、异步任务之间会存在差异，所以它们在执行的优先级也会有区别。大致分为微任务（Promise、MutationObserver）和宏任务(setTimeout、setInterval、I/O)
  4、Promise执行器中的代码会被同步调用，但是回调是基于宏任务的
  5、微任务的优先级高于宏任务（这才是根本原因）

• EventLoop Tick:

  微任务

  1、JS引擎发起的任务
  2、在ES6规范中，将其称为jobs
  3、```Promise、MutaionObserver、process.nextTick```
  

  宏任务

  1、宿主(Node、浏览器)发起的任务
  2、在ES6规范中，将其称为task
  3、```script、setTimeout、setInterval、I/O、UI rendering、postMessage、MessageChannel、setImmediate```
  

  Event Loop中，每一次循环称为tick，每一次tick的任务如下：

  • 微观任务执行顺序始终先于宏观任务，并且每个宏观任务可以包含多个微观任务

  • 宏观任务保存在“任务队列“中，微观任务保存在微任务的队列中，事件循环其实也就是不断执行宏观任务

  • 微任务优先级高的根本原因是执行Loop时会优先检查微任务队列，清空后再去检查宏任务执行队列
    

代码执行流程

• 所有的代码都写在script标签中，所以读取所有代码是第一个宏任务，我们开始执行第一个宏任务。
• 我们首先遇到setTimeout,他是第二个宏任务，将它扔进宏任务事件队列里先排队。
• 下来我们遇到promise, promise执行器里的代码会被同步调用，所以我们依次打印出2和3
• 下来我们接着打印出5，然后执行微任务并且打印出4
• 我们第一个宏任务执行完毕，执行下一个宏任务，打印出1，到此，所有任务都执行完毕。