歡迎訪問我的個人博客：http://www.xiaolongwu.cn
前言
promise為es6引進的語言標准，為異步編程的一種解決方案；
閱讀此文的前提是了解瀏覽器event loop的機制，還有promise的基本用法和特性，比如他自執行特性、狀態不可逆特性等
拋出問題
且看下面代碼和問題
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
既然promise.then和setTimeout都是異步的，那么在事件循環隊列中 promise.then的事件應該排在setTimeout后面，那為什么promise.then卻在setTimeout前面被打印了出來？
重要概念
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，到此，所有任務都執行完畢。
所以我們最后的結果為2 3 5 4 1。
結束
github資源地址：js基礎進階--promise和setTimeout執行順序的問題
csdn博客地址：https://blog.csdn.net/wxl1555
如果您對我的博客內容有疑惑或質疑的地方，請在下方評論區留言，或郵件給我，共同學習進步。
郵箱：wuxiaolong802@163.com