js event循環(huán)機(jī)制是怎樣

js
小樊
82
2024-10-09 07:12:30

JavaScript 事件循環(huán)機(jī)制是 JavaScript 運(yùn)行時(shí)的核心，它決定了 JavaScript 如何處理異步操作和事件。JavaScript 是單線程的，這意味著它一次只能執(zhí)行一個(gè)任務(wù)。為了實(shí)現(xiàn)非阻塞性操作，JavaScript 引入了事件循環(huán)機(jī)制。

事件循環(huán)機(jī)制包括以下幾個(gè)部分：

  1. 調(diào)用棧：當(dāng) JavaScript 代碼執(zhí)行時(shí)，函數(shù)調(diào)用會(huì)形成一個(gè)調(diào)用棧。調(diào)用棧是一個(gè)執(zhí)行上下文棧，用于存儲(chǔ)當(dāng)前正在執(zhí)行的函數(shù)。當(dāng)一個(gè)函數(shù)執(zhí)行完畢，它會(huì)從調(diào)用棧中彈出，繼續(xù)執(zhí)行下一個(gè)函數(shù)。

  2. 事件隊(duì)列：JavaScript 代碼中的異步操作（如定時(shí)器、網(wǎng)絡(luò)請(qǐng)求等）會(huì)被放入事件隊(duì)列中等待執(zhí)行。事件隊(duì)列是一個(gè)先進(jìn)先出（FIFO）的數(shù)據(jù)結(jié)構(gòu)，用于存儲(chǔ)待執(zhí)行的異步操作。

  3. 微任務(wù)隊(duì)列：當(dāng)調(diào)用棧中的代碼執(zhí)行完畢，JavaScript 引擎會(huì)檢查微任務(wù)隊(duì)列中是否有任務(wù)需要執(zhí)行。如果有，則會(huì)依次執(zhí)行微任務(wù)隊(duì)列中的任務(wù)。

  4. 宏任務(wù)隊(duì)列：當(dāng)微任務(wù)隊(duì)列中的任務(wù)執(zhí)行完畢，JavaScript 引擎會(huì)從宏任務(wù)隊(duì)列中取出一個(gè)任務(wù)執(zhí)行，執(zhí)行完畢后再回到微任務(wù)隊(duì)列中執(zhí)行微任務(wù)。

事件循環(huán)機(jī)制的執(zhí)行流程如下：

  1. 執(zhí)行調(diào)用棧中的代碼，直到調(diào)用棧為空。
  2. 檢查微任務(wù)隊(duì)列中是否有任務(wù)需要執(zhí)行，如果有，則依次執(zhí)行微任務(wù)隊(duì)列中的任務(wù)。
  3. 從宏任務(wù)隊(duì)列中取出一個(gè)任務(wù)執(zhí)行，執(zhí)行完畢后再回到微任務(wù)隊(duì)列中執(zhí)行微任務(wù)。
  4. 重復(fù)執(zhí)行步驟 2 和步驟 3，直到宏任務(wù)隊(duì)列和微任務(wù)隊(duì)列都為空。

需要注意的是，微任務(wù)和宏任務(wù)的執(zhí)行順序是不同的。微任務(wù)的執(zhí)行優(yōu)先級(jí)高于宏任務(wù)，即微任務(wù)隊(duì)列中的任務(wù)會(huì)在宏任務(wù)隊(duì)列中的任務(wù)之前執(zhí)行。這樣可以確保 JavaScript 能夠及時(shí)處理異步操作，避免阻塞。

0 踩