js Event Loop 事件循環(huán)

來(lái)源：Loong Panda

概念

Event Loop即事件循環(huán)
，是解決javaScript單線程運(yùn)行阻塞的一種機(jī)制。 主要是為了協(xié)調(diào)單線程下，事件 、用戶交互 、腳本 、UI 渲染和網(wǎng)絡(luò)處理等行為，防止主線程的不阻塞
。

因?yàn)镴avaScript 是單線程，也就是說(shuō)，所有任務(wù)需要排隊(duì)，前一個(gè)任務(wù)結(jié)束，才會(huì)執(zhí)行后一個(gè)任務(wù)。

但是IO設(shè)備（輸入 、出設(shè)備）可能會(huì)因?yàn)榫W(wǎng)絡(luò)等因數(shù)導(dǎo)致速度很慢（比如Ajax）繼而CPU沒(méi)有充分利用 ，所以設(shè)計(jì)者將IO設(shè)備的任務(wù)掛起
，先執(zhí)行后面的任務(wù) ，等到IO設(shè)備返回了結(jié)果
，再回過(guò)頭  ，把掛起的任務(wù)繼續(xù)執(zhí)行下去。于是，就把所有任務(wù)分成兩種，一種是同步任務(wù)（synchronous）  ，另一種是異步任務(wù)（asynchronous） 。

同步任務(wù)：

只有前一個(gè)任務(wù)執(zhí)行完畢
 ，才能執(zhí)行后一個(gè)任務(wù)；直接在主線程上排隊(duì)執(zhí)行且最先執(zhí)行，形成一個(gè)執(zhí)行棧

異步任務(wù)  ：

不進(jìn)入主線程
、而是進(jìn)入"任務(wù)隊(duì)列"（task queue）的任務(wù) ，只有"任務(wù)隊(duì)列"通知主線程，某個(gè)異步任務(wù)可以執(zhí)行了
，該任務(wù)才會(huì)進(jìn)入主線程執(zhí)行 。

一、microtask(微任務(wù))1、Promise.then2
、MutationObserver（Mutation Observer API 用來(lái)監(jiān)視 DOM 變動(dòng)）3	、Object.observe()（已廢棄）4	、nextTick(Node.js 環(huán)境)二、macrotask(宏任務(wù))1
、script(整體代碼) 注: 這個(gè)很容易忽略掉,就是指script根環(huán)境,而且它永遠(yuǎn)是第一個(gè)執(zhí)行的宏任務(wù)(包含了同步的任務(wù)).2	、setTimeout3、setInterval4
	、setImmediate5
、IO6、UI rendering(DOM event)

執(zhí)行機(jī)制 ：

（1）所有同步任務(wù)都在主線程上執(zhí)行，形成一個(gè)執(zhí)行棧（execution context stack）
。
（2）主線程之外