JavaScript 事件循環

kbyyd24 發布于2019-08-22 16:36 / 1048人閱讀

摘要：總而言之，檢查調用棧是否為空，以及確定把哪個異步任務加入調用棧的這個過程就是事件循環，而實現異步的核心就是事件循環。

js是一門單線程的語言，不可能進行多線程編程，異步編程就是多線程編程一種模式，但是我們經常講到js的異步編程，其實是偽異步，因為它是單線程的，也就是同步，只有前面的代碼執行完才能執行下面的代碼。所以要理解js中的異步理念，就需要了解js的運行核心--事件循環(Event loop)

為什么js會有異步呢

setTimeout(function(){
    //5秒之后執行程序
    
},5000)

我們想象一下，在同步的執行上面的代碼，需要等待5秒才能執行定時器中的程序，然后在往下執行，在這5秒的過程中，瀏覽器沒有任何反應，出現了阻塞，在用戶體驗上很不好。所以異步的模式就出現，為了解決瀏覽器非阻塞的運行。

單線程如何做到異步

js的任務分為同步和異步兩種，它們的處理方式也不同，同步任務是直接在主線程上排隊執行，異步任務則會被放到事件隊列中，若有多個異步任務則要在事件隊列中排隊等待，事件隊列類似一個緩沖區，任務下一步會被移到調用棧,然后主線程執行調用棧的任務。

單線程是指js引擎中負責解析執行js代碼的線程只有一個主線程，即每次只能做一件事，而我們知道一個ajax請求，主線程在等待它響應的同時是會去做其它事的，瀏覽器先在事件表注冊ajax的回調函數，響應回來后回調函數被添加到任務隊列中等待執行，不會造成線程阻塞，所以說js處理ajax請求的方式是異步的。

總而言之，檢查調用棧是否為空，以及確定把哪個異步任務加入調用棧的這個過程就是事件循環，而js實現異步的核心就是事件循環。

一次事件循環的步驟包括：

主線程在執行代碼的時候，遇到異步任務會將它添加到一個事件隊列中(可以理解為一個數組)，然后繼續執行下面的代碼，直到同步代碼執行完，然后執行步驟2

檢查事件隊列是否為空，非空執行步驟3，為空則繼續執行步驟2

取出事件隊列中的第一個放到調用棧，然后主線程執行調用棧的任務，再執行步驟4

執行視圖更新，然后回到步驟2

這就是事件循環

先看一段代碼，理解一下：(面試題哦)

console.log("start")

setTimeout(function() {
  console.log("setTimeout")
}, 0)

Promise.resolve().then(function() {
  console.log("promise1")
}).then(function() {
  console.log("promise2")
})

console.log("end")

打印臺輸出的log順序是什么？結合上面的步驟分析一下

最后的結果是：

start
end
promise1
pormise2
setTimeout

參考資料

Event Loop

GPU云服務器云服務器 python事件循環 js事件循環機制 gpu javascript循環嵌套循環javascript

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/94496.html

什么是JavaScript 事件循環 ?

摘要：此事件隊列的美妙之處在于它只是函數等待被調用和移動到調用棧的一個臨時存放區域。在事件循環不斷監視調用棧是否為空現在確實是空的時候調用創建一個新的調用棧來執行代碼。在執行完之后進入了一個新的狀態這個狀態調用棧為空事件記錄表為空事件隊列也為空。這篇文章是對個人認為講解　JavaScript　事件循環比較清楚的一篇英文文章的簡單翻譯,原文地址是http://altitudelabs.com...

tracymac7 2019-08-20 16:15 評論0 收藏0
JavaScript運行機制和事件循環

摘要：主線程不斷重復上面的三步，此過程也就是常說的事件循環。所以主線程代碼執行時間過長，會阻塞事件循環的執行。參考資料這一次，徹底弄懂執行機制任務隊列的順序機制事件循環搞懂異步事件輪詢與中的事件循環 1. 說明讀過本文章后，您能知道： JavaScript代碼在瀏覽器中的執行機制和事件循環面試中經常遇到的代碼輸出順序問題首先通過一段代碼來驗證你是否了解代碼輸出順序，如果你不知道輸出...

Ververica 2019-08-23 14:42 評論0 收藏0
總結javascript基礎概念（二）：事件隊列循環

摘要：而事件循環是主線程中執行棧里的代碼執行完畢之后，才開始執行的。由此產生的異步事件執行會作為任務隊列掛在當前循環的末尾執行。在下，觀察者基于監聽事件的完成情況在下基于多線程創建。主要問題： 1、JS引擎是單線程，如何完成事件循環的？ 2、定時器函數為什么計時不準確？ 3、回調與異步,有什么聯系和不同？ 4、ES6的事件循環有什么變化？Node中呢？ 5、異步控制有什么難點？有什么解決方...

zhkai 2019-08-26 11:42 評論0 收藏0
JavaScript單線程事件循環(Event Loop)那些事

摘要：概述本篇主要介紹的運行機制單線程事件循環結論先在中利用運行至完成和非阻塞完成單線程下異步任務的處理就是先處理主模塊主線程上的同步任務再處理異步任務異步任務使用事件循環機制完成調度涉及的內容有單線程事件循環同步執行異步執行定時器的事件循環開始 1.概述本篇主要介紹JavaScript的運行機制:單線程事件循環(Event Loop). 結論先: 在JavaScript中, 利用運行至...

Shisui 2019-08-20 16:50 評論0 收藏0
事件循環與任務隊列

摘要：需要注意的是，定時器比較特殊，并沒有把回調函數掛在事件循環隊列中，它所做的就是設置一個定時器，當定時器到時后，環境會把你的回調函數放在事件循環中，這樣，在未來某個時刻的會被取出執行。 Author: bugall Wechat: bugallF Email: 769088641@qq.com Github: https://github.com/bugall 一...

SQC 2019-08-21 11:40 評論0 收藏0
JavaScript事件循環(Event Loop)

摘要：事件循環的順序，決定代碼執行的順序。輸出第二輪事件循環正式結束三第三輪事件循環第三輪事件循環從宏任務開始。記為遇到，立即執行回調函數放入中注冊，然后被分發到微任務事件隊列中。 1、為什么要有事件循環？因為js是單線程的，事件循環是js的執行機制，也是js實現異步的一種方法。既然js是單線程，那就像只有一個窗口的銀行，客戶需要排隊一個一個辦理業務，同理js任務也要一個一個順序執行。如...

dmlllll 2019-08-23 14:52 評論0 收藏0