JavaScript Event Loop相關(guān)原理解析
1.單線程模型
單線程模型指的是,JavaScript只能在一個(gè)線程上運(yùn)行,也就是說只能同時(shí)指向一個(gè)任務(wù),其他任務(wù)都必須在后面排隊(duì)等待。注意:雖然JavaScript只在一個(gè)線程上運(yùn)行,但并不代碼JavaScript引擎只有一個(gè)線程。事實(shí)上,JavaScript引擎有多個(gè)線程,單個(gè)腳本只能在一個(gè)線程上運(yùn)行(主線程),其他線程都是在后臺(tái)配合。
JavaScript為什么要采用單線程,而不是多線程?
不想讓瀏覽器變得復(fù)雜(避免復(fù)雜性),因?yàn)槎嗑€程需要共享資源、且可能修改彼此運(yùn)行的結(jié)果。
該模式會(huì)導(dǎo)致的問題?
如果單個(gè)任務(wù)耗時(shí)長,會(huì)拖延整個(gè)程序的執(zhí)行,可能導(dǎo)致瀏覽器無響應(yīng)(假死)
JavaScript是如何解決這個(gè)問題的?
因?yàn)閱尉€程的原因,CPU很多時(shí)候都閑著的,并且因?yàn)镮O操作(輸入輸出)很慢(比如Ajax操作從網(wǎng)絡(luò)讀取數(shù)據(jù)),這時(shí)CPU可以完全不管IO操作,掛起等待中的任務(wù),先運(yùn)行排在后面的任務(wù)。等到IO操作返回了結(jié)果,再回過頭,把掛起的任務(wù)繼續(xù)執(zhí)行下去。這種機(jī)制就是JavaScript內(nèi)部采用的“事件循環(huán)”機(jī)制(Event Loop)
2.同步任務(wù)和異步任務(wù)
程序里面所有的任務(wù),可以分成兩類:同步任務(wù)(synchronous)和異步任務(wù)(asynchronous)
同步任務(wù):沒有被引擎掛起、在主線程上排隊(duì)執(zhí)行的任務(wù)。只有前一個(gè)任務(wù)執(zhí)行完畢,才能執(zhí)行后一個(gè)任務(wù)。
異步任務(wù):被引擎放一邊、不進(jìn)行主線程、而進(jìn)入任務(wù)隊(duì)列的任務(wù)。只有引擎認(rèn)為某個(gè)異步任務(wù)可以執(zhí)行了(比如Ajax操作從服務(wù)器得到了結(jié)果),那么該任務(wù)(通過回調(diào)函數(shù)的形式)才能進(jìn)入主線程執(zhí)行。排在異步任務(wù)后面的代碼,不用等到異步任務(wù)結(jié)束就會(huì)馬上運(yùn)行,也就是說,異步任務(wù)不具有“堵塞”效應(yīng)
3.任務(wù)隊(duì)列和事件循環(huán)
JavaScript運(yùn)行時(shí),除了一個(gè)正在運(yùn)行的主線程(又稱為“調(diào)用棧(call stack)”),引擎還提供了一個(gè)任務(wù)隊(duì)列(task queue),里面是各種需要處理當(dāng)前程序處理的異步任務(wù)。(實(shí)際上,根據(jù)異步任務(wù)的類型,存在多個(gè)任務(wù)隊(duì)列,后面再詳講)
1.主線程會(huì)去執(zhí)行所有的同步任務(wù)。
2.等到同步任務(wù)全部執(zhí)行完,查看任務(wù)隊(duì)列中的異步任務(wù),將滿足條件的重新進(jìn)入主線程開始執(zhí)行,這時(shí)候就變成同步任務(wù)。
3.等任務(wù)執(zhí)行完,下一個(gè)異步任務(wù)再進(jìn)入主線程開始執(zhí)行。
4.引擎不停檢查(“事件循環(huán)”),一旦任務(wù)隊(duì)列清空,程序就結(jié)束執(zhí)行。
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. 什么是Python變量作用域2. Android 實(shí)現(xiàn)徹底退出自己APP 并殺掉所有相關(guān)的進(jìn)程3. Vue實(shí)現(xiàn)仿iPhone懸浮球的示例代碼4. js select支持手動(dòng)輸入功能實(shí)現(xiàn)代碼5. Android studio 解決logcat無過濾工具欄的操作6. vue使用moment如何將時(shí)間戳轉(zhuǎn)為標(biāo)準(zhǔn)日期時(shí)間格式7. bootstrap select2 動(dòng)態(tài)從后臺(tái)Ajax動(dòng)態(tài)獲取數(shù)據(jù)的代碼8. 一個(gè) 2 年 Android 開發(fā)者的 18 條忠告9. PHP正則表達(dá)式函數(shù)preg_replace用法實(shí)例分析10. vue-drag-chart 拖動(dòng)/縮放圖表組件的實(shí)例代碼
