Javascript是單線程的深入分析__Java

本來想總結一下的，網上卻發現有人已經解釋的很清楚了，特轉過來。

這也解釋了為什麼在用自動化測試載入器來運行dumrendtree時設定的逾時和測試case設定的逾時的關聯性。

面試的時候發現99%的童鞋不理解為什麼JavaScript是單線程的卻能讓AJAX非同步發送和回調請求，還有setTimeout也看起來像是多線程的。還有non-blocking IO, event loop等概念很不清楚。來深入分析一下：

首先看下面的代碼：

1 2 3 4 5 6 7 8 9

function  foo() {      console.log( 'first'  );      setTimeout( ( function (){ console.log( 'second'  ); } ), 5);   }   for  ( var  i = 0; i < 1000000; i++) {      foo(); }

執行結果會首先全部輸出first，然後全部輸出second；儘管中間的執行會超過5ms。為什麼。 Javascript是單線程的

因為JS運行在瀏覽器中，是單線程的，每個window一個JS線程，既然是單線程的，在某個特定的時刻只有特定的代碼能夠被執行，並阻塞其它的代碼。而瀏覽器是事件驅動的（Event driven），瀏覽器中很多行為是非同步（Asynchronized）的，會建立事件並放入執行隊列中。javascript引擎是單線程處理它的任務隊列，你可以理解成就是普通函數和回呼函數構成的隊列。當非同步事件發生時，如mouse click, a timer firing, or an XMLHttpRequest completing（滑鼠點擊事件發生、定時器觸發事件發生、XMLHttpRequest完成回調觸發等），將他們放入執行隊列，等待當前代碼執行完成。 非同步事件驅動

前面已經提到瀏覽器是事件驅動的（Event driven），瀏覽器中很多行為是非同步（Asynchronized）的，例如：滑鼠點擊事件、視窗大小拖拉事件、定時器觸發事件、XMLHttpRequest完成回調等。當一個非同步事件發生的時候，它就進入事件隊列。瀏覽器有一個內部大訊息迴圈，Event Loop（事件迴圈），會輪詢大的事件隊列並處理事件。例如，瀏覽器當前正在忙於處理onclick事件，這時另外一個事件發生了（如：window onSize），這個非同步事件就被放入事件隊列等待處理，只有前面的處理完畢了，空閑了才會執行這個事件。setTimeout也是一樣，當調用的時候，js引擎會啟動定時器timer，大約xxms以後執行xxx，當定時器時間到，就把該事件放到主事件隊列等待處理（瀏覽器不忙的時候才會真正執行）。

每個瀏覽器具體實現主事件隊列不盡相同，這不談了。 瀏覽器不是單線程的

雖然JS運行在瀏覽器中，是單線程的，每個window一個JS線程，但瀏覽器不是單線程的，例如Webkit或是Gecko引擎，都可能有如下線程： javascript引擎線程 介面渲染線程 瀏覽器事件觸發線程 Http請求線程

很多童鞋搞不清，如果js是單線程的，那麼誰去輪詢大的Event loop事件隊列。答案是瀏覽器會有單獨的線程去處理這個隊列。 Ajax非同步請求是否真的非同步?

很多童鞋搞不清楚，既然說JavaScript是單線程啟動並執行，那麼XMLHttpRequest在串連後是否真的非同步? 
其實請求確實是非同步，這請求是由瀏覽器新開一個線程請求（見前面的瀏覽器多線程）。當請求的狀態變更時，如果先前已設定回調，這非同步線程就產生狀態變更事件放到 JavaScript引擎的事件處理隊列中等待處理。當瀏覽器閒置時候出隊列任務被處理，JavaScript引擎始終是單線程運行回呼函數。javascript引擎確實是單線程處理它的任務隊列，能理解成就是普通函數和回呼函數構成的隊列。

總結一下，Ajax請求確實是非同步，這請求是由瀏覽器新開一個線程請求，事件回調的時候是放入Event loop單線程事件隊列等候處理。 setTimeout(func, 0)為什麼有時候有用。

寫js多的童鞋可能發現，有時候加一個setTimeout(func, 0)非常有用，為什麼。難道是類比多線程嗎。錯。前面已經說過了，javascript是JS運行在瀏覽器中，是單線程的，每個window一個JS線程，既然是單線程的，setTimeout(func, 0)神奇在哪兒。那就是告訴js引擎，在0ms以後把func放到主事件隊列中，等待當前的代碼執行完畢再執行，注意：重點是改變了代碼流程，把func的執行放到了等待當前的代碼執行完畢再執行。這就是它的神奇之處了。它的用處有三個： 讓瀏覽器渲染當前的變化（很多瀏覽器UI render和js執行是放在一個線程中，線程阻塞會導致介面無法更新渲染） 重新評估”script is running too long”警告 改變執行順序

例如：下面的例子，點擊按鈕就會顯示"calculating...."，如果刪除setTimeout就不會。因為reDraw事件被進入事件隊列到長時間操作的最後才能被執行，所以無法重新整理。