這篇文章帶給大家的內容是關於js中事件循環(EventLoop)的詳細介紹（附程式碼），有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。
在學習eventloop之前，我們需要複習一下js的單執行緒和非同步。
雖說js是單執行緒的，但在瀏覽器和Node中都做了對應的處理。如瀏覽器中的web workers（工作執行緒），Node中的child_process（子進程）。它們的出現對大量計算的分解起到了促進作用。
當進程啟動時，Node會建立一個tick循環，每個tick循環透過內部的觀察者來查看是否有事件需要處理，如果有就取出事件和它相關的回呼函數去執行，執行完以後就進入下一個循環，如果不再有就退出進程。
在瀏覽器中把非同步事件放到工作執行緒中，避免阻塞主執行緒UI的渲染
console.log('进程开始')
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('进程结束')從結果可以看出三種非同步處理不阻塞主執行緒程式碼的執行，而ajax、fetch、setTimeout則根據程式碼處理結束的先後來執行回呼函數。
Node中的事件循環是根據觀察者的優先權來執行，同一個迴圈內的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('正常执行')事件循環的執行特點，源自於利用單線程，遠離多線程死鎖、狀態同步等問題；利用非同步讓單線程遠離阻塞，以更好的使用CPU。
相關推薦：
以上是node.js中事件循環(EventLoop)的詳細介紹（附程式碼）的詳細內容。更多資訊請關注PHP中文網其他相關文章！
