資訊專欄INFORMATION COLUMN
摘要：事件循環(huán)當(dāng)進(jìn)程啟動(dòng)時(shí)，會(huì)創(chuàng)建一個(gè)循環(huán)，每個(gè)循環(huán)通過(guò)內(nèi)部的觀察者來(lái)查看是否有事件需要處理，如果有就取出事件和它相關(guān)的回調(diào)函數(shù)去執(zhí)行，執(zhí)行完以后就進(jìn)入下一個(gè)循環(huán)，如果不再有就退出進(jìn)程。
前言
在學(xué)習(xí)eventloop之前，我們需要復(fù)習(xí)一下js的單線程和異步。事件循環(huán)
雖說(shuō)js是單線程的，但是在瀏覽器和Node中都做了相應(yīng)的處理。如瀏覽器中的web workers（工作線程），Node中的child_process（子進(jìn)程）。它們的出現(xiàn)對(duì)大量計(jì)算的分解起到了促進(jìn)作用。
當(dāng)進(jìn)程啟動(dòng)時(shí)，Node會(huì)創(chuàng)建一個(gè)tick循環(huán)，每個(gè)tick循環(huán)通過(guò)內(nèi)部的觀察者來(lái)查看是否有事件需要處理，如果有就取出事件和它相關(guān)的回調(diào)函數(shù)去執(zhí)行，執(zhí)行完以后就進(jìn)入下一個(gè)循環(huán)，如果不再有就退出進(jìn)程。
瀏覽器中的eventloop在瀏覽器中把異步事件放到工作線程中，避免阻塞主線程UI的渲染
console.log("進(jìn)程開(kāi)始")
const ajax = new XMLHttpRequest()
ajax.addEventListener("load", () => {
console.log("load")
})
ajax.addEventListener("loadend", () => {
if (ajax.readyState == 4 && ajax.status == 200) {
console.log("ajax success")
} else {
console.log("ajax success")
}
})
ajax.open("get", "http://localhost/study/html/vue.js")
ajax.send()
setTimeout(() => {
console.log("setTimeout")
}, 300)
fetch("http://localhost/study/html/demo.json",{
headers: {
"content-type": "application/json"
}
}).then(res => {
console.log("fetch")
})
let i = 0
while(i < 10000) {
i++
}
console.log(i)
console.log("進(jìn)程結(jié)束")
從結(jié)果可以看出三種異步處理不阻塞主線程代碼的執(zhí)行，而ajax、fetch、setTimeout根據(jù)代碼處理結(jié)束的先后來(lái)執(zhí)行回調(diào)函數(shù)。Nodejs中的eventloop
Node中的事件循環(huán)根據(jù)觀察者的優(yōu)先級(jí)來(lái)執(zhí)行，同一個(gè)循環(huán)內(nèi)的process.nextTick -> setTimeout -> setImmediate
setTimeout(() => {
console.log("setTimeout")
}, 0)
setImmediate(() => {
console.log("setImmediate1")
process.nextTick(() => {
console.log("setImmediate1 插入nextTick")
})
})
setImmediate(() => {
console.log("setImmediate2")
})
process.nextTick(() => {
setTimeout(() => {
console.log("nextTick1 setTimeout")
}, 100)
console.log("nextTick1")
})
process.nextTick(() => {
console.log("nextTick2")
})
console.log("正常執(zhí)行")
總結(jié)
事件循環(huán)的執(zhí)行特點(diǎn)，源于利用單線程，遠(yuǎn)離多線程死鎖、狀態(tài)同步等問(wèn)題；利用異步讓單線程遠(yuǎn)離阻塞，以更好的使用CPU。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/108360.html
摘要：事件循環(huán)當(dāng)進(jìn)程啟動(dòng)時(shí)，會(huì)創(chuàng)建一個(gè)循環(huán)，每個(gè)循環(huán)通過(guò)內(nèi)部的觀察者來(lái)查看是否有事件需要處理，如果有就取出事件和它相關(guān)的回調(diào)函數(shù)去執(zhí)行，執(zhí)行完以后就進(jìn)入下一個(gè)循環(huán)，如果不再有就退出進(jìn)程。 前言 在學(xué)習(xí)eventloop之前，我們需要復(fù)習(xí)一下js的單線程和異步。雖說(shuō)js是單線程的，但是在瀏覽器和Node中都做了相應(yīng)的處理。如瀏覽器中的web workers（工作線程），Node中的child_...
摘要：事件循環(huán)當(dāng)進(jìn)程啟動(dòng)時(shí)，會(huì)創(chuàng)建一個(gè)循環(huán)，每個(gè)循環(huán)通過(guò)內(nèi)部的觀察者來(lái)查看是否有事件需要處理，如果有就取出事件和它相關(guān)的回調(diào)函數(shù)去執(zhí)行，執(zhí)行完以后就進(jìn)入下一個(gè)循環(huán)，如果不再有就退出進(jìn)程。 前言 在學(xué)習(xí)eventloop之前，我們需要復(fù)習(xí)一下js的單線程和異步。雖說(shuō)js是單線程的，但是在瀏覽器和Node中都做了相應(yīng)的處理。如瀏覽器中的web workers（工作線程），Node中的child_...
摘要：隨著狀態(tài)發(fā)生變化，相應(yīng)的產(chǎn)生。這些被轉(zhuǎn)發(fā)到中的來(lái)采取相應(yīng)的操作。當(dāng)收到數(shù)據(jù)或相關(guān)的狀態(tài)改變時(shí)，這些方法被調(diào)用，這些方法和的生命周期密切相關(guān)。主要由一系列組成的。采用的線程模型，在同一個(gè)線程的中處理所有發(fā)生的事。 「博客搬家」 原地址: 簡(jiǎn)書(shū) 原發(fā)表時(shí)間: 2017-05-05 學(xué)習(xí)了一段時(shí)間的 Netty，將重點(diǎn)與學(xué)習(xí)心得總結(jié)如下，本文主要總結(jié)ChannelHandler 及 E...
摘要：現(xiàn)實(shí)中是這樣的執(zhí)行結(jié)果為結(jié)果告訴我們，是單線程沒(méi)錯(cuò)，不過(guò)不是逐行同步執(zhí)行。搜索了很多官方個(gè)人博客得到了一堆詞引擎主線程事件表事件隊(duì)列宏任務(wù)微任務(wù)，徹底懵逼。。。以此規(guī)則不停的執(zhí)行下去就是我們所聽(tīng)到的事件循環(huán)。 都知道javascript是單線程，那么問(wèn)題來(lái)了，既然是單線程順序執(zhí)行，那怎么做到異步的呢？ 我們理解的單線程應(yīng)該是這樣的，排著一個(gè)個(gè)來(lái)，是同步執(zhí)行。 showImg(https...
閱讀 2755·2023-04-25 22:15
閱讀 1818·2021-11-19 09:40
閱讀 2164·2021-09-30 09:48
閱讀 3238·2021-09-03 10:36
閱讀 2039·2021-08-30 09:48
閱讀 1876·2021-08-24 10:00
閱讀 2742·2019-08-30 15:54
閱讀 716·2019-08-30 15:54
