之前看的文，感覺不太完整，于是找了篇詳細的文章原文鏈接。翻譯不正確的請指出，重在分享，如果有所收獲就更好了。

Javascript是如何異步和單線程的？簡短的回答是javascript語言是單線程的，異步行為不是它的一部分，相反，它是建立在瀏覽器（或編程環境）中的核心JavaScript語言之上，并通過瀏覽器API訪問。

現在為了得到答案，讓我寫兩個示例代碼片段。

基本架構

• 堆：對象在堆中分配，表示大多數非結構化的內存區域。
• 棧：這表示JavaScript代碼執行提供的單個線程，函數調用形成一個棧。
• 瀏覽器或Web API是內置在你的web瀏覽器中，能夠暴露瀏覽器和周圍的計算機環境中的數據，并使用它執行游泳的復雜操作。它們不是JavaScript語言的一部分，而是基于核心JavaScript語言構建，為你的JavaScript代碼中提供額外的超能力。例如，Geolocation API提供了一些簡單的JavaScript構造，用于檢索數據，所以你可以說，在Google map上繪制你的位置。在后臺，瀏覽器實際上使用一些復雜的低級代碼（例如C++）與設備的GPS硬件（或者任何可用于確定位置數據的信息）進行通信，檢索位置數據，并將其返回到瀏覽器環境用來使用在你的代碼中。但同樣，這種復雜性是由API抽象出來的。

代碼片段1:迷惑心靈

function main(){console.log('A');setTimeout(function display(){ console.log('B'); },0);console.log('C'); } main(); // Output // A // C // B 復制代碼

這里，我們有一個主函數，它有兩個console.log：將A和C輸入到控制臺上。它們中間是一個在0ms后將B輸出到控制臺上的setTimeOut調用。

調用主函數，首先將它推入到棧中。然后瀏覽器將主函數的第一個聲明console.log('A')推入到棧中，執行此語句，并在完成后彈出，字母A顯示在控制臺上。

第二個聲明setTimeout推入棧中并開始執行。setTimeout函數使用瀏覽器的API來延遲回調其中的函數。一旦交接給brower完成timer，這一幀就被推出。

當計時器在瀏覽器中運行來回調exec函數時，console.log(‘C’)被推入棧中。在這種特殊的情況下，由于提供的延遲是0ms，一旦瀏覽器接收到它（理想情況下），回調將被添加到消息隊列中。

執行完主函數的最后一個語句，主函數從調用堆棧中彈出，從而堆棧為空。對于瀏覽器將任何消息從隊列推送到調用堆棧中，調用堆棧必須為空。這就是為什么即使setTimeout中提供的延遲是0ms，exec的也必須等到調用堆棧中的所有幀的執行完成。

現在exec的回調被推入調用棧，接著執行。字母C顯示在控制臺上。這就是JavaScript的事件循環。

因此setTimeout（function，delayTime）中的delay參數不代表執行函數之后的精確時間延遲。它代表最小等待時間，之后在某個時間點執行該功能。

代碼片段2:深入理解

function main(){console.log('A');setTimeout(function exec(){ console.log('B'); }, 0);runWhileLoopForNSeconds(3);console.log('C'); } main(); function runWhileLoopForNSeconds(sec){let start = Date.now(), now = start;while (now - start < (sec*1000)) {now = Date.now();} } // Output // A // C // B 復制代碼

• 函數runWhileLoopForNSeconds完全符合其名稱所代表的含義，它會不斷檢查從調用時間開始經過的時間是否等于函數參數提供的秒數。要記住的要點是while循環（與許多其他循環一樣）是一個阻塞語句，意味著它的執行發生在調用堆棧上，并且不使用瀏覽器API。因此它會阻止所有后續語句，直到它執行完成。
• 所以在上面的代碼中，即使setTimeout的延遲為0ms，但在while循環運行3s中，exec()回調會卡在消息隊列中。只有在while循環在調用堆棧（單線程）上運行3s完成，調用堆棧變空之后，回調exec()被推入到調用堆棧并執行。
• 因此setTimeout()中的delay參數不保證在計時器完成延遲后開始執行。它是延遲部分的最短時間。

總結

以上是生活随笔為你收集整理的[译]理解js中的event loop的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。