摘要:所以在瀏覽器的幫助下,作為一種單線程語言,可以實現異步操作。每個異步任務都和一個回調函數相關聯。主線程執行同步任務的同時,子線程執行異步任務,并將相應的結果事件放入任務隊列。
前言
js引擎不是獨立運行的,它運行在宿主環境中,這個環境可以是瀏覽器、可以是服務器,或者其他硬件設施。所以在瀏覽器的幫助下,js作為一種單線程語言,可以實現異步操作。
瀏覽器內核是多線程的,幾個常駐的線程:渲染引擎線程、js引擎線程、定時觸發器線程、事件觸發線程、異步http請求線程。
并發模型MDN-并發模型
左邊的棧存儲的是同步任務。右邊的堆用來存儲聲明的變量、對象。下面的隊列就是任務隊列,一旦某個異步任務有了響應就會被推入隊列中。每個異步任務都和一個回調函數相關聯。
一個js程序的單線程用來執行棧中的同步任務,當所有同步任務執行完畢后,棧被清空,然后讀取任務隊列中的一個待處理任務,并把相關回調函數壓入棧中,單線程開始執行新的同步任務,執行完畢。
單線程從任務隊列中讀取任務是不斷循環的,每次棧被清空后,都會在任務隊列中讀取新的任務,如果沒有新的任務,就會等待,直到有新的任務,這就叫任務循環或者事件循環
事件循環(Event Loop)事件循環的大致流程如下:
主線程執行所有同步任務,形成一個執行棧(并發模型中的stack)。
主線程執行同步任務的同時,子線程執行異步任務,并將相應的結果(事件)放入任務隊列。
一旦執行棧中的所有同步任務執行完畢,系統就會讀取任務隊列,把任務隊列中事件相應的回調函數壓入棧內開始執行。
執行回調后,棧空,繼續重復第三步,形成一個循環。
Macrotask(task)(macro)task(又稱之為宏任務),可以理解是每次執行棧執行的代碼就是一個宏任務(包括每次從事件隊列中獲取一個事件回調并放到執行棧中執行)。
瀏覽器為了能夠使得JS內部(macro)task與DOM任務能夠有序的執行,會在一個(macro)task執行結束后,在下一個(macro)task 執行開始前,對頁面進行重新渲染。
(macro)task主要包含:script(整體代碼)、setTimeout、setInterval、I/O、UI交互事件、postMessage、MessageChannel、setImmediate(Node.js 環境)
microtaskmicrotask(又稱為微任務),可以理解是在當前 task 執行結束后立即執行的任務。也就是說,在當前task任務后,下一個task之前,在渲染之前。
所以它的響應速度相比setTimeout(setTimeout是task)會更快,因為無需等渲染。也就是說,在某一個macrotask執行完后,就會將在它執行期間產生的所有microtask都執行完畢(在渲染前)。
microtask主要包含:Promise.then、MutaionObserver、process.nextTick(Node.js 環境)
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/100423.html
摘要:深入理解引擎的執行機制靈魂三問為什么是單線程的為什么需要異步單線程又是如何實現異步的呢中的中的說說首先請牢記點是單線程語言的是的執行機制。 深入理解JS引擎的執行機制 1.靈魂三問 : JS為什么是單線程的? 為什么需要異步? 單線程又是如何實現異步的呢? 2.JS中的event loop(1) 3.JS中的event loop(2) 4.說說setTimeout 首先,請牢記2...
摘要:深入理解引擎的執行機制最近在反省,很多知識都是只會用,不理解底層的知識。在閱讀之前,請先記住兩點是單線程語言的是的執行機制。所以,是存在異步執行的,比如單線程是怎么實現異步的場景描述通過事件循環,所以說,理解了機制,也就理解了的執行機制啦。 深入理解js引擎的執行機制 最近在反省,很多知識都是只會用,不理解底層的知識。所以在開發過程中遇到一些奇怪的比較難解決的bug,在思考的時候就會收...
摘要:引言學習的時候,經常聽人說,即是異步的,又是單線程的。所以我們說是異步單線程的。參考從瀏覽器多進程到單線程,運行機制最全面的一次梳理運行機制詳解再談異步機制詳解運行原理解析并發模型與事件循環 showImg(https://segmentfault.com/img/bVbo4hv?w=1800&h=1000); 引言 學習javascipt的時候,經常聽人說,javascipt即是異步...
摘要:圖片轉引自的演講和兩個定時器中回調的執行邏輯便是典型的機制。異步編程關于異步編程我的理解是,在執行環境所提供的異步機制之上,在應用編碼層面上實現整體流程控制的異步風格。 問題背景 在一次開發任務中,需要實現如下一個餅狀圖動畫,基于canvas進行繪圖,但由于對于JS運行環境中異步機制的不了解,所以遇到了一個棘手的問題,始終無法解決,之后在與同事交流之后才恍然大悟。問題的根節在于經典的J...
摘要:異步任務必須指定回調函數,當異步任務從任務隊列回到執行棧,回調函數就會執行。事件循環主線程從任務隊列中讀取事件,這個過程是循環不斷的,所以整個的這種運行機制又稱為。事件循環事件循環是指主線程重復從消息隊列中取消息執行的過程。 參考鏈接:這一次,徹底弄懂 JavaScript 執行機制https://zhuanlan.zhihu.com/p/...從瀏覽器多進程到JS單線程,JS運行機制...
閱讀 1759·2023-04-25 16:28
閱讀 695·2021-11-23 09:51
閱讀 1477·2019-08-30 15:54
閱讀 1163·2019-08-30 15:53
閱讀 2837·2019-08-30 15:53
閱讀 3427·2019-08-30 15:43
閱讀 3269·2019-08-30 11:18
閱讀 3290·2019-08-26 10:25