Event Loop
JS是一門單線程的非阻塞的腳本語言没隘，只有一個(gè)主線程來處理所有任務(wù)届宠。當(dāng)JS執(zhí)行一系列任務(wù)時(shí)蛤袒，由于JS是單線程的，同一時(shí)間只能處理一個(gè)任務(wù)塌衰，于是這些任務(wù)就在執(zhí)行棧中排隊(duì)诉稍，JS會(huì)依次執(zhí)行這些任務(wù)。當(dāng)JS執(zhí)行一項(xiàng)異步任務(wù)（如I/O）時(shí)杯巨，主線程不會(huì)一直等待其返回結(jié)果，而是掛起（pending）這個(gè)任務(wù)努酸，繼續(xù)執(zhí)行執(zhí)行棧中的其他任務(wù)服爷，等異步任務(wù)返回結(jié)果時(shí)再根據(jù)一定規(guī)則去執(zhí)行相應(yīng)的回調(diào)。當(dāng)異步任務(wù)返回結(jié)果時(shí)获诈，JS會(huì)將這個(gè)異步任務(wù)加入與當(dāng)前執(zhí)行棧不同的另一個(gè)隊(duì)列--事件隊(duì)列仍源。被加入事件隊(duì)列的異步任務(wù)的回調(diào)不會(huì)立即被執(zhí)行，而是等待當(dāng)前執(zhí)行棧中的任務(wù)執(zhí)行完畢舔涎，主線程閑置時(shí)笼踩，JS從事件隊(duì)列中，取出排在第一位的任務(wù)亡嫌，將對(duì)應(yīng)回調(diào)放入執(zhí)行棧嚎于，并執(zhí)行其中的同步代碼掘而，如此反復(fù)，形成一個(gè)無限循環(huán)于购，稱為事件循環(huán)（Event Loop）袍睡。
Macro Task 和 Micro Task
異步任務(wù)并不相同，它們的執(zhí)行順序也有差異价涝。不同的異步任務(wù)分為兩類：宏任務(wù)（Macro Task）和微任務(wù)（Micro Task）女蜈。
以下事件屬于宏任務(wù)：
- setTimeout()
- setInterval()
以下事件屬于微任務(wù)：
- Promise.then()
當(dāng)前執(zhí)行棧中任務(wù)執(zhí)行完畢時(shí)，JS會(huì)查看微任務(wù)隊(duì)列中是否有事件色瘩，如果沒有，會(huì)去宏任務(wù)隊(duì)列中取出排在第一位的事件并把其對(duì)應(yīng)回調(diào)放入當(dāng)前執(zhí)行棧執(zhí)行逸寓；如果微任務(wù)隊(duì)列中有事件居兆，會(huì)依次執(zhí)行事件對(duì)應(yīng)的回調(diào)，直到微任務(wù)隊(duì)列清空竹伸，再去宏任務(wù)隊(duì)列中取出排在第一位的事件并把其對(duì)應(yīng)回調(diào)放入當(dāng)前執(zhí)行棧執(zhí)行泥栖，如此循環(huán)。即同步代碼執(zhí)行完畢之后勋篓，先清空微任務(wù)吧享，再執(zhí)行第一個(gè)宏任務(wù)，同一次事件循環(huán)中譬嚣，微任務(wù)永遠(yuǎn)在宏任務(wù)之前執(zhí)行钢颂。
這樣就能解釋以下代碼：
console.log('script start')
let timer1 = setTimeout(() => {
console.log('timer1')
let promise1 = new Promise((resolve, reject) => {
console.log('timer1-Promise1')
resolve()
})
promise1.then(() => {
console.log('timer1-Promise1-then')
})
}, 0)
let timer2 = setTimeout(() => {
console.log('timer2')
}, 0)
let promise2 = new Promise((resolve, reject) => {
console.log('Promise2')
resolve()
})
promise2
.then(() => {
console.log('Promise2-then1')
})
.then(() => {
console.log('Promise2-then2')
})
console.log('script end')
執(zhí)行結(jié)果：
簡單分析：
主線程依次執(zhí)行這段代碼，同步代碼直接執(zhí)行拜银，異步代碼掛起殊鞭，加入事件隊(duì)列。
以下代碼直接執(zhí)行：
console.log('script start')
let promise2 = new Promise((resolve, reject) => {
console.log('Promise2')
resolve()
})
console.log('script end')
注意：作為Promise參數(shù)的這個(gè)函數(shù)是同步代碼尼桶，會(huì)直接執(zhí)行操灿。因此前三個(gè)打印結(jié)果依次是
script start
Promise2
script end
以下事件被加入宏任務(wù)：
timer1
timer2
以下事件被加入微任務(wù)：
promise2
.then()
.then()
同步代碼執(zhí)行完畢，執(zhí)行棧清空泵督，主線程查看微任務(wù)隊(duì)列趾盐，執(zhí)行相應(yīng)回調(diào)清空微任務(wù)隊(duì)列，打印出
Promise2-then1
Promise2-then2
微任務(wù)隊(duì)列清空完畢后小腊，主線程查看宏任務(wù)隊(duì)列救鲤，執(zhí)行排在第一位的事件（timer1）對(duì)應(yīng)回調(diào)。
timer1的回調(diào)又開始了新的Event Loop：
同步代碼：
console.log('timer1')
let promise1 = new Promise((resolve, reject) => {
console.log('timer1-Promise1')
resolve()
})
直接執(zhí)行溢豆，打印出：
timer1
timer1-Promise1
以下事件加入微任務(wù)：
promise1.then()
同步代碼執(zhí)行完畢蜒简，清空微任務(wù)隊(duì)列，打印出：
timer1-Promise1-then
此時(shí)宏任務(wù)隊(duì)列排在第一位的是timer2漩仙，主線程取出timer2執(zhí)行相應(yīng)回調(diào)搓茬，打印出：
timer2
整個(gè)腳本執(zhí)行完畢犹赖。
