web前端之執行機制

我們先來幾道題了解一**驗一下執行機制

console.
log(1)
;settimeout
(function()
,0);
console.
log(
2)

最後列印順序：

1,2,3

我們來看看這是為什麼

js是單執行緒的，同一時間只能做一件事，從上到下執行

任務佇列：settimeout是個非同步任務，非同步任務要掛起，繼續執行同步任務，同步任務完成後才去執行非同步任務，所以碰到settimeout就掛起，先輸出2，才返回去執行掛起任務，輸出3

console.
log(
'a')
;while
(true
)console.
log(
'b')

輸出：

a這是個同步任務，遇到while後一直迴圈空，輪不到輸出b

console.
log(
'a')
;settimeout
(function()
,0);
while(1
)

輸出a

輸出a以後，碰到settimeout非同步，掛起，去執行while同步任務，死迴圈

執行機制類

for
(var i=
0;i<
4;i++),
1000);
}

輸出4,4，4，4

考察非同步任務的放入時間和執行時間

for迴圈是同步任務，幾毫秒之後迴圈執行結束，此時i是4,1s後把settimeout放入非同步任務中，然後輸出的就是4

乙個時間之內js只能看一件事

分為同步任務和非同步任務

（1）同步任務

按照順利往下執行

（2）非同步任務

非同步任務掛起，同步執行完之後再去執行非同步

事件迴圈：瀏覽器的搜尋引擎遇到了settimeout，識別了這是乙個非同步任務，不會把它放到執行棧裡面，而是把它拿走，拿走之後，也不是立馬把它放到非同步任務佇列中，同步任務執行完後，執行非同步任務佇列中，讀出來有需要執行的任務後就把它放到執行棧中去執行，第乙個非同步任務就這樣執行完後，再去非同步任務棧中讀取下乙個任務放到執行棧中，如此迴圈

接下來我們來看什麼時候會開啟非同步任務：

settimeout和setinterval

dom事件：一般都是使用者在介面上操作的時候遇到卡頓基本上都是因為非同步

es6中的promise

見上見上