promise和setTimeout执行顺序的问题

setTimeout(function(){console.log(1)},0);
new Promise(function(resolve){
console.log(2)
for( var i=0 ; i<10000 ; i++ ){
i==9999 && resolve()
}
console.log(3)
}).then(function(){
console.log(4)
});
console.log(5);
// 这的问题是，为何答案是 2 3 5 4 1
// 而不是 2 3 5 1 4
---------------------
做者：LeonWuV
来源：CSDN
原文：https://blog.csdn.net/wxl1555/article/details/80054538
版权声明：本文为博主原创文章，转载请附上博文连接！

 

event loop 的概念

Javascript是单线程的，全部的同步任务都会在主线程中执行。

当主线程中的任务，都执行完以后，系统会 “依次” 读取任务队列里的事件。与之相对应的异步任务进入主线程，开始执行。

异步任务之间，会存在差别，因此它们执行的优先级也会有区别。大体分为 微任务（micro task，如：Promise、MutaionObserver等）和宏任务（macro task，如：setTimeout、setInterval、I/O等）。

Promise 执行器中的代码会被同步调用，可是回调是基于微任务的。

宏任务的优先级高于微任务

每个宏任务执行完毕都必须将当前的微任务队列清空

第一个 script 标签的代码是第一个宏任务

主线程会不断重复上面的步骤，直到执行完全部任务。

个人理解

咱们来捋一遍代码的执行过程，

全部的代码都写在script标签中，因此读取全部代码是第一个宏任务，咱们开始执行第一个宏任务。

咱们首先遇到setTimeout，他是第二个宏任务，将它扔进宏任务事件队列里先排队。

下来咱们遇到promise，promise执行器里的代码会被同步调用，因此咱们依次打印出2和3。

下来遇到promise的回调，他是一个微任务，将它扔进微任务事件对列中。

下来咱们接着打印出5，而后执行微任务而且打印出4.

咱们第一个宏任务执行完毕，执行下一个宏任务，打印出1，到此，全部任务都执行完毕。