文章目錄
- JavaScript事件回圈機制
- 執行緒和行程的概念
- 瀏覽器執行執行緒
- 瀏覽器內核的多種執行緒
- JavaScript 事件回圈機制
JavaScript事件回圈機制
- JavaScript 是一門 單執行緒 的編程語言,這就意味著它一次只能完成一件事情,如果有多個任務,就必須要排隊一個一個來.
- JavaScript 任務有同步的也有異步的,按照上面的說法,如果某個任務耗時過長的話很可能就會造成頁面的阻塞,但實際使用中我們發現其實它能很好地處理異步的問題,這其中就是 JavaScript 事件回圈機制在起作用
執行緒和行程的概念
- 行程 是系統分配的獨立資源,是 CPU 資源分配的基本單位,行程是由一個或者多個執行緒組成的,行程可以理解為一個工廠,為應用程式的執行提供基礎環境.
- 執行緒 是行程的執行流,是CPU調度和分派的基本單位,同個行程之中的多個執行緒之間是共享該行程的資源的,執行緒可以理解為是負責執行應用程式的工人
瀏覽器執行執行緒
- 瀏覽器是多行程的,瀏覽器渲染行程(瀏覽器內核)屬于瀏覽器多行程中的一種,主要負責頁面渲染,腳本執行,事件處理等
- JavaScript 引擎執行緒 作為其中的執行緒之一,其特點是單執行緒作業,負責決議運行 JavaScript 腳本,JavaScript 運行耗時過長就會導致頁面阻塞
瀏覽器內核的多種執行緒
-
GUI 渲染執行緒:
GUI 渲染執行緒負責渲染頁面,決議 HTML,CSS 構成 DOM 樹等,當頁面重繪或者由于某種操作引起回流都會調起該執行緒,GUI 渲染執行緒和 JS 引擎執行緒是互斥的,當 JS 引擎執行緒在作業的時候,GUI 渲染執行緒會被掛起,GUI 更新被放入在 JS 任務佇列中,等待 JS 引擎執行緒空閑的時候繼續執行,
-
JS 引擎執行緒:
JS 引擎執行緒:單執行緒作業,負責決議運行 JavaScript 腳本,JS 引擎執行緒*和 GUI 渲染執行緒互斥,JS 運行耗時過長就會導致頁面阻塞,
-
事件觸發執行緒:
當事件符合觸發條件被觸發時,該執行緒會把對應的事件回呼函式添加到任務佇列的隊尾,等待 JS 引擎處理, -
定時器觸發執行緒:
瀏覽器定時計數器并不是由 JS 引擎計數的,阻塞會導致計時不準確,開啟定時器觸發執行緒來計時并觸發計時,計時完成后會被添加到任務佇列中,等待 JS 引擎處理,
-
http 請求執行緒:
http 請求的時候會開啟一條請求執行緒.
請求完成有結果了之后,將請求的回呼函式添加到任務佇列中,等待 JS 引擎處理,

JavaScript 事件回圈機制
-
Javascript 有一個 main thread 主執行緒和 call-stack 呼叫堆疊(執行堆疊),所有的任務都會被放到呼叫堆疊等待主執行緒執行,
1. JS 呼叫堆疊:
JS 呼叫堆疊是一種后進先出的資料結構,當函式被呼叫時,會被添加到堆疊中的頂部,執行完成之后就從堆疊頂部移出該函式,直到堆疊內被清空,
2. 同步任務、異步任務
JavaScript 單執行緒中的任務分為同步任務和異步任務,同步任務會在呼叫堆疊中按照順序排隊等待主執行緒執行.
異步任務則會在異步有了結果后將注冊的回呼函式添加到任務佇列(訊息佇列)中等待主執行緒空閑的時候,也就是堆疊內被清空的時候,被讀取到堆疊中等待主執行緒執行,任務佇列是先進先出的資料結構,
3.Event Loop
瀏覽器 Event Loop 是 HTML 中定義的規范.呼叫堆疊中的同步任務都執行完畢,堆疊內被清空了,就代表主執行緒空閑了,這個時候就會去任務佇列中按照順序讀取一個任務放入到堆疊中執行,
每次堆疊內被清空,都會去讀取任務佇列有沒有任務,有就讀取執行,一直回圈讀取-執行的操作,就形成了事件回圈,


轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/290284.html
標籤:其他
