1.關於JavaScript

JavaScript是一門單執行緒語言，在最新的html5中提出了Web-Worker，但javascript是單執行緒這一核心仍未改變。所以一切javascript版的"多執行緒"都是用單執行緒模擬出來的，一切javascript多執行緒都是紙老虎！

2.javascript事件迴圈

既然js是單執行緒，那就像只有一個視窗的銀行，客戶需要排隊一個一個辦理業務，同理js任務也要一個一個順序執行。如果一個任務耗時過長，那麼後一個任務也必須等著。那麼問題來了，假如我們想瀏覽新聞，但是新聞包含的超清圖片載入很慢，難道我們的網頁要一直卡著直到圖片完全顯示出來？因此聰明的程式設計師將任務分為兩類：

• 同步任務
• 非同步任務

當我們開啟網站時，網頁的渲染過程就是一大堆同步任務，比如頁面骨架和頁面元素的渲染。而像載入圖片音樂之類佔用資源大耗時久的任務，就是非同步任務。關於這部分有嚴格的文字定義，但本文的目的是用最小的學習成本徹底弄懂執行機制，所以我們用導圖來說明：

導圖要表達的內容用文字來表述的話：

• 同步和非同步任務分別進入不同的執行"場所"，同步的進入主執行緒，非同步的進入Event Table並註冊函式。
• 當指定的事情完成時，Event Table會將這個函式移入Event Queue。
• 主執行緒內的任務執行完畢為空，會去Event Queue讀取對應的函式，進入主執行緒執行。
• 上述過程會不斷重複，也就是常說的Event Loop(事件迴圈)。

我們不禁要問了，那怎麼知道主執行緒執行棧為空啊？js引擎存在monitoring process程序，會持續不斷的檢查主執行緒執行棧是否為空，一旦為空，就會去Event Queue那裡檢查是否有等待被呼叫的函式。

3.Promise與process.nextTick(callback)

Promise的定義和功能本文不再贅述，不瞭解的讀者可以學習一下阮一峰老師的Promise。而process.nextTick(callback)類似node.js版的"setTimeout"，在事件迴圈的下一次迴圈中呼叫 callback 回撥函式。

我們進入正題，除了廣義的同步任務和非同步任務，我們對任務有更精細的定義：

• macro-task(巨集任務)：包括整體程式碼script，setTimeout，setInterval
• micro-task(微任務)：Promise，process.nextTick

不同型別的任務會進入對應的Event Queue，比如setTimeout和setInterval會進入相同的Event Queue。

事件迴圈的順序，決定js程式碼的執行順序。進入整體程式碼(巨集任務)後，開始第一次迴圈。接著執行所有的微任務。然後再次從巨集任務開始，找到其中一個任務佇列執行完畢，再執行所有的微任務。

事件迴圈的程序模型

• 選擇當前要執行的任務佇列，選擇任務佇列中最先進入的任務，如果任務佇列為空即null，則執行跳轉到微任務（MicroTask）的執行步驟。
• 將事件迴圈中的任務設定為已選擇任務。
• 執行任務。
• 將事件迴圈中當前執行任務設定為null。
• 將已經執行完成的任務從任務佇列中刪除。
• microtasks步驟：進入microtask檢查點。
• 更新介面渲染。
• 返回第一步。

執行棧在執行完同步任務後，檢視執行棧是否為空，如果執行棧為空，就會去檢查微任務(microTask)佇列是否為空，如果為空的話，就執行Task（巨集任務），否則就一次性執行完所有微任務。
每次單個巨集任務執行完畢後，檢查微任務(microTask)佇列是否為空，如果不為空的話，會按照先入先出的規則全部執行完微任務(microTask)後，設定微任務(microTask)佇列為null，然後再執行巨集任務，如此迴圈。

例子：

輸出結果：

1 7 6 8 2 4 3 5 9 11 10 12

4.process.nextTick和Promise都是Microtasks（微任務），為什麼process.nextTick會先執行？

rocess.nextTick 永遠大於 promise.then，原因其實很簡單。。。在Node中，_tickCallback在每一次執行完TaskQueue中的一個任務後被呼叫，而這個_tickCallback中實質上幹了兩件事：

1.nextTickQueue中所有任務執行掉(長度最大1e4，Node版本v6.9.1)

2.第一步執行完後執行_runMicrotasks函式，執行microtask（微任務）中的部分(promise.then註冊的回撥)

所以很明顯 process.nextTick > promise.then

http://www.ssnd.com.cn 化妝品OEM代加工

5.總結

(1)js的非同步

我們從最開頭就說javascript是一門單執行緒語言，不管是什麼新框架新語法糖實現的所謂非同步，其實都是用同步的方法去模擬的，牢牢把握住單執行緒這點非常重要。

(2)事件迴圈Event Loop

事件迴圈是js實現非同步的一種方法，也是js的執行機制。

(3)javascript的執行和執行

執行和執行有很大的區別，javascript在不同的環境下，比如node，瀏覽器，Ringo等等，執行方式是不同的。而執行大多指javascript解析引擎，是統一的。

(4)setImmediate

微任務和巨集任務還有很多種類，比如setImmediate等等，執行都是有共同點的，有興趣的同學可以自行了解。

(5)最後的最後

• javascript是一門單執行緒語言
• Event Loop是javascript的執行機制

6.深入淺出分析process.nextTick()

process.nextTick() 是 Node 的一個定時器，讓任務可以在指定的時間執行。其中 Node 一共提供了 4 個定時器，它們分別是 setTimeout()、setInterval()、setImmediate()、process.nextTick()。

process.nextTick()這個名字有點誤導，它是在本輪迴圈執行的，而且是所有非同步任務裡面最快執行的。

Node 執行完所有同步任務，接下來就會執行process.nextTick的任務佇列。所以，下面這行程式碼是第二個輸出結果。

process.nextTick(() => console.log(3));

基本上，如果你希望非同步任務儘可能快地執行，那就使用 process.nextTick。

根據語言規格，Promise 物件的回撥函式，會進入非同步任務裡面的”微任務”（microtask）佇列。
微任務佇列追加在 process.nextTick 佇列的後面，也屬於本輪迴圈。所以，下面的程式碼總是先輸出 3，再輸出 4。

process.nextTick(() => console.log(3));
Promise.resolve().then(() => console.log(4)); // 3 // 4

注意，只有前一個佇列全部清空以後，才會執行下一個佇列。

process.nextTick(() => console.log(1));
Promise.resolve().then(() => console.log(2));
process.nextTick(() => console.log(3));
Promise.resolve().then(() => console.log(4)); // 1 // 3 // 2 // 4

上面程式碼中，全部 process.nextTick 的回撥函式，執行都會早於 Promise 的。