JavaScript Event Loop

陶非凡發表於2020-11-12

1.單執行緒模型

單執行緒模型指的是,JavaScript只能在一個執行緒上執行,也就是說只能同時指向一個任務,其他任務都必須在後面排隊等待。注意:雖然JavaScript只在一個執行緒上執行,但並不程式碼JavaScript引擎只有一個執行緒。事實上,JavaScript引擎有多個執行緒,單個指令碼只能在一個執行緒上執行(主執行緒),其他執行緒都是在後臺配合。

  • JavaScript為什麼要採用單執行緒,而不是多執行緒?
    不想讓瀏覽器變得複雜(避免複雜性),因為多執行緒需要共享資源、且可能修改彼此執行的結果。

  • 該模式會導致的問題?
    如果單個任務耗時長,會拖延整個程式的執行,可能導致瀏覽器無響應(假死)

  • JavaScript是如何解決這個問題的?
    因為單執行緒的原因,CPU很多時候都閒著的,並且因為IO操作(輸入輸出)很慢(比如Ajax操作從網路讀取資料),這時CPU可以完全不管IO操作,掛起等待中的任務,先執行排在後面的任務。等到IO操作返回了結果,再回過頭,把掛起的任務繼續執行下去。這種機制就是JavaScript內部採用的“事件迴圈”機制(Event Loop)

2.同步任務和非同步任務

程式裡面所有的任務,可以分成兩類:同步任務(synchronous)和非同步任務(asynchronous)

  • 同步任務:沒有被引擎掛起、在主執行緒上排隊執行的任務。只有前一個任務執行完畢,才能執行後一個任務。

  • 非同步任務:被引擎放一邊、不進行主執行緒、而進入任務佇列的任務。只有引擎認為某個非同步任務可以執行了(比如Ajax操作從伺服器得到了結果),那麼該任務(通過回撥函式的形式)才能進入主執行緒執行。排在非同步任務後面的程式碼,不用等到非同步任務結束就會馬上執行,也就是說,非同步任務不具有“堵塞”效應

3.任務佇列和事件迴圈

JavaScript執行時,除了一個正在執行的主執行緒(又稱為“呼叫棧(call stack)”),引擎還提供了一個任務佇列(task queue),裡面是各種需要處理當前程式處理的非同步任務。(實際上,根據非同步任務的型別,存在多個任務佇列,後面再詳講)

1.主執行緒會去執行所有的同步任務。
2.等到同步任務全部執行完,檢視任務佇列中的非同步任務,將滿足條件的重新進入主執行緒開始執行,這時候就變成同步任務。
3.等任務執行完,下一個非同步任務再進入主執行緒開始執行。
4.引擎不停檢查(“事件迴圈”),一旦任務佇列清空,程式就結束執行。

關於以上Event Loop過程的講解,可參考本視訊
2分鐘瞭解 JavaScript Event Loop | 面試必備

相關文章