理解JS執行順序

前言

---

衆所周知，JS的執行順序是自上而下的。
嚴格意義上來講，javascript沒有多線程的概念，全部的程序都是單線程依次執行的。
就是代碼在執行過程當中，另外一段代碼想要執行就必須等當前代碼執行完成後才能夠進行。

注意

js代碼執行分爲兩個部分：
一、代碼的檢查裝載階段（預編譯階段），此階段進行變量和函數的聲明，可是不對變量進行賦值，
   變量的默認值爲undefined。
二、代碼的執行階段，此階段對變量進行賦值和函數的聲明。
因此：Js的變量提高和函數提高會影響JS的執行結果，ES6中的let定義的變量不會提高 
三、js的執行順序，先同步後異步
四、異步中任務隊列的執行順序： 先微任務microtask隊列，再宏任務macrotask隊列
五、調用Promise 中的resolve，reject屬於微任務隊列，setTimeout屬於宏任務隊列
因此：【同步>異步；微任務>宏任務】

示例

console.log('event start')
setTimeout(function () {
    console.log('setTimeout');
});

new Promise(function(resolve,reject){
    console.log('promise start')
    resolve()
}).then(function(){
    console.log('promise end')
})
console.log('event end')

執行結果爲：

event start
promise start
event end
promise end
undefined
setTimeout

解釋：

主線程執行按順序代碼
遇到 setTimeout, 回調進入到宏任務隊列上
遇到 Promise, 當即執行, then 函數進入到微任務隊列
同步代碼執行結束, 主線程檢查是否存在微任務, 發現 then, 執行
微任務執行完畢, 再去查找宏任務 setTimeout, 執行
setTimeout 執行結束, 檢查是否存在微任務, 不存在, 結束.

圖例