摘要:異步任務必須指定回調函數,當異步任務從任務隊列回到執行棧,回調函數就會執行。事件循環主線程從任務隊列中讀取事件,這個過程是循環不斷的,所以整個的這種運行機制又稱為。事件循環事件循環是指主線程重復從消息隊列中取消息執行的過程。
參考鏈接:
這一次,徹底弄懂 JavaScript 執行機制
https://zhuanlan.zhihu.com/p/...
從瀏覽器多進程到JS單線程,JS運行機制最全面的一次梳理
JavaScript引擎是單線程運行的,瀏覽器無論在什么時候都只且只有一個線程在運行JavaScript程序.瀏覽器的內核是多線程的,它們在內核制控下相互配合以保持同步,一個瀏覽器至少實現三個常駐線程:javascript引擎線程,GUI渲染線程,瀏覽器事件觸發線程。這些異步線程都會產生不同的異步的事件.
javascript引擎是基于事件驅動單線程執行的,JS引擎一直等待著任務隊列中任務的到來,然后加以處理,瀏覽器無論什么時候都只有一個JS線程在運行JS程序。
GUI渲染線程負責渲染瀏覽器界面,當界面需要重繪(Repaint)或由于某種操作引發回流(reflow)時,該線程就會執行。但需要注意 GUI渲染線程與JS引擎是互斥的,當JS引擎執行時GUI線程會被掛起,GUI更新會被保存在一個隊列中等到JS引擎空閑時立即被執行。
事件觸發線程,當一個事件被觸發時該線程會把事件添加到待處理隊列的隊尾,等待JS引擎的處理。這些事件可來自JavaScript引擎當前執行的代碼塊如setTimeOut、也可來自瀏覽器內核的其他線程如鼠標點擊、AJAX異步請求等,但由于JS的單線程關系所有這些事件都得排隊等待JS引擎處理。(當線程中沒有執行任何同步代碼的前提下才會執行異步代碼)
JavaScript運行機制程序中跑兩個線程,一個負責程序本身的運行,作為主線程; 另一個負責主線程與其他線程的的通信,被稱為“Event Loop 線程" 。每當遇到異步任務,交給 EventLoop 線程,然后自己往后運行,等到主線程運行完后,再去 EventLoop 線程拿結果。
1)所有任務都在主線程上執行,形成一個執行棧(execution context stack)。
2)主線程之外,還存在一個"任務隊列"(task queue)。系統把異步任務放到"任務隊列"之中,然后繼續執行后續的任務。
3)一旦"執行棧"中的所有任務執行完畢,系統就會讀取"任務隊列"。如果這個時候,異步任務已經結束了等待狀態,就會從"任務隊列"進入執行棧,恢復執行。
4)主線程不斷重復上面的第三步。
"回調函數"(callback),就是那些會被主線程掛起來的代碼。異步任務必須指定回調函數,當異步任務從"任務隊列"回到執行棧,回調函數就會執行。"任務隊列"是一個先進先出的數據結構,排在前面的事件,優先返回主線程。主線程的讀取過程基本上是自動的,只要執行棧一清空,"任務隊列"上第一位的事件就自動返回主線程。
Event Loop(事件循環)主線程從"任務隊列"中讀取事件,這個過程是循環不斷的,所以整個的這種運行機制又稱為Event Loop。
Event Loop 是一個很重要的概念,指的是計算機系統的一種運行機制。JavaScript語言就采用這種機制,來解決單線程運行帶來的一些問題。
javascript是單線程的,這個線程中擁有唯一的一個事件循環。異步setTimeout & setInterval 概念
JavaScript代碼的執行過程中,除了依靠函數調用棧來搞定函數的執行順序外,還依靠任務隊列(task queue)來搞定另外一些代碼的執行。
一個線程中,事件循環是唯一的,但是任務隊列可以擁有多個。
setTimeout:在指定的毫秒數后,將定時任務處理的函數添加到執行隊列的隊尾。
setInterval:按照指定的周期(以毫秒數計時),將定時任務處理函數添加到執行隊列的隊尾。
從主線程的角度看,一個異步過程包括下面兩個要素:
發起函數(或叫注冊函數)A
回調函數callbackFn
它們都是在主線程上調用的,其中注冊函數用來發起異步過程,回調函數用來處理結果。
例如setTimeout(fn, 1000),其中的setTimeout就是異步過程的發起函數,fn是回調函數。用一句話概括:工作線程將消息放到消息隊列,主線程通過事件循環過程去取消息。
消息隊列:消息隊列是一個先進先出的隊列,它里面存放著各種消息。
事件循環:事件循環是指主線程重復從消息隊列中取消息、執行的過程。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/93792.html
摘要:從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好,我們就需要引入來降低異步編程的復雜性。異步編程入門的全稱是前端經典面試題從輸入到頁面加載發生了什么這是一篇開發的科普類文章,涉及到優化等多個方面。 TypeScript 入門教程 從 JavaScript 程序員的角度總結思考,循序漸進的理解 TypeScript。 網絡基礎知識之 HTTP 協議 詳細介紹 HTT...
摘要:是現在廣泛流行的代從開始學習系列之向提交代碼掘金讀完本文大概需要分鐘。為了進行高效的垃圾回收,虛擬機把堆內存劃分成新生代老年代和永久代中無永久代,使用實現三塊區域。 React Native 開源項目 - 仿美團客戶端 (Android、iOS 雙適配) - Android - 掘金推薦 React Native 學習好項目,仿照美團客戶端... 極簡 GitHub 上手教程 - 工具...
摘要:模塊化是隨著前端技術的發展,前端代碼爆炸式增長后,工程化所采取的必然措施。目前模塊化的思想分為和。特別指出,事件不等同于異步,回調也不等同于異步。將會討論安全的類型檢測惰性載入函數凍結對象定時器等話題。 Vue.js 前后端同構方案之準備篇——代碼優化 目前 Vue.js 的火爆不亞于當初的 React,本人對寫代碼有潔癖,代碼也是藝術。此篇是準備篇,工欲善其事,必先利其器。我們先在代...
閱讀 3338·2022-01-04 14:20
閱讀 3106·2021-09-22 15:08
閱讀 2187·2021-09-03 10:44
閱讀 2314·2019-08-30 15:44
閱讀 1490·2019-08-29 18:40
閱讀 2654·2019-08-29 17:09
閱讀 2988·2019-08-26 13:53
閱讀 3220·2019-08-26 13:37