JS的異步機(jī)制由事件循環(huán)和任務(wù)隊(duì)列構(gòu)成。JS本身是單線程語(yǔ)言,所謂異步依賴于瀏覽器或者操作系統(tǒng)等完成。JavaScript主線程擁有一個(gè)執(zhí)行棧以及一個(gè)任務(wù)隊(duì)列蹂随，主線程會(huì)依次執(zhí)行代碼耕魄，當(dāng)遇到函數(shù)時(shí)悠抹，會(huì)先將函數(shù)入棧，函數(shù)運(yùn)行完畢后再將該函數(shù)出棧，直到所有代碼執(zhí)行完畢。
遇到異步操作（例如：setTimeout, AJAX）時(shí)脂倦，異步操作會(huì)由瀏覽器(OS)執(zhí)行，瀏覽器會(huì)在這些任務(wù)完成后元莫，將事先定義的回調(diào)函數(shù)推入主線程的任務(wù)隊(duì)列(task queue)中,當(dāng)主線程的執(zhí)行棧清空之后會(huì)讀取task queue中的回調(diào)函數(shù),當(dāng)task queue被讀取完畢之后,主線程接著執(zhí)行,從而進(jìn)入一個(gè)無(wú)限的循環(huán),這就是事件循環(huán).
Microtask 與 Macrotask
一個(gè)瀏覽器環(huán)境只能擁有一個(gè)事件循環(huán)(event loop),而一個(gè)事件循環(huán)可以多個(gè)任務(wù)隊(duì)列（Task queue）赖阻，每個(gè)任務(wù)都有一個(gè)任務(wù)源（Task source）。任務(wù)隊(duì)列是一個(gè)先進(jìn)先出的隊(duì)列.
macrotask(macro-task: script（整體代碼）, setTimeout, setInterval, setImmediate, I/O, UI rendering) 和 microtask(micro-task: process.nextTick, Promises（這里指瀏覽器實(shí)現(xiàn)的原生 Promise）, Object.observe, MutationObserver) 是異步任務(wù)的兩種分類踱蠢。在掛起任務(wù)時(shí)政供，JS 引擎會(huì)將所有任務(wù)按照類別分到這兩個(gè)隊(duì)列中，首先在 macrotask 的隊(duì)列（這個(gè)隊(duì)列也被叫做 task queue）中取出第一個(gè)任務(wù)朽基，執(zhí)行完畢后取出 microtask 隊(duì)列中的所有任務(wù)順序執(zhí)行；之后再取 macrotask 任務(wù)离陶，周而復(fù)始稼虎，直至兩個(gè)隊(duì)列的任務(wù)都取完。
全部代碼(script)是一個(gè)macrotask, js先執(zhí)行一個(gè)macrotask,執(zhí)行過(guò)程中遇到(setTimeout, setInterval, setImmediate等)異步操作則創(chuàng)建一個(gè)macrotask,遇到(process.nextTick, Promises等)創(chuàng)建一個(gè)microtask, 這兩個(gè)queue分別被掛起. 執(zhí)行棧為空時(shí)開始處理macrotask, 完成后處理microtask, 直到該microtask全部執(zhí)行完,然后繼續(xù)主線程調(diào)用棧.
每一次事件循環(huán)（one cycle of the event loop）招刨，只處理一個(gè)macrotask霎俩。待該 macrotask 完成后，所有的 microtask 會(huì)在同一次循環(huán)中處理沉眶。處理這些 microtask 時(shí)打却，還可以將更多的 microtask 入隊(duì)，它們會(huì)一一執(zhí)行谎倔，直到整個(gè)microtask隊(duì)列處理完柳击。
主要流程如下：
1. 所有同步任務(wù)都在主線程上執(zhí)行，形成一個(gè)執(zhí)行棧
2. 主線程之外片习，還存在一個(gè)任務(wù)隊(duì)列只要異步任務(wù)有了運(yùn)行結(jié)果捌肴，就在任務(wù)隊(duì)列之中放置一個(gè)任務(wù)蹬叭。
3. 一旦執(zhí)行棧中的所有同步任務(wù)執(zhí)行完畢，系統(tǒng)就會(huì)讀取任務(wù)隊(duì)列状知，看看里面有哪些任務(wù)秽五。那些對(duì)應(yīng)的異步任務(wù)，就結(jié)束等待狀態(tài)饥悴，進(jìn)入執(zhí)行棧開始被執(zhí)行坦喘。
4. 主線程不斷重復(fù)以上三步。
js引擎存在monitoring process進(jìn)程西设，會(huì)持續(xù)不斷的檢查主線程執(zhí)行棧是否為空瓣铣，一旦為空，就會(huì)去task queue那里檢查是否有等待被調(diào)用的函數(shù)济榨。
