需要了解的點(diǎn)：單線程，同步帜消、異步棠枉，執(zhí)行棧，任務(wù)隊(duì)列泡挺，宏任務(wù)辈讶，微任務(wù)
什么是單線程
單線程是指同一時(shí)間只能做一件事情。
JavaScript為什么是單線程的
js作為瀏覽器的腳本語言娄猫，不僅僅是用于和用戶交互贱除，往往還需要操作DOM咳促，所以如果是多線程的話，那么多個(gè)線程同時(shí)操作DOM的時(shí)候勘伺，就不知道要以哪個(gè)為基準(zhǔn)了，所以它的用途決定了它只能是單線程的褂删。
值得一提的是H5提出的Web Worker標(biāo)準(zhǔn)飞醉，允許JavaScript創(chuàng)建多個(gè)線程，但是子線程完全受限于主線程屯阀，且不得操作DOM缅帘，所以這個(gè)新標(biāo)準(zhǔn)并沒有改變JavaScript單線程的本質(zhì)。
執(zhí)行棧难衰，任務(wù)隊(duì)列
執(zhí)行棧管理同步任務(wù)钦无，任務(wù)隊(duì)列管理異步任務(wù)，異步任務(wù)又分為異步宏任務(wù)盖袭、異步微任務(wù)失暂。
同步任務(wù)、異步任務(wù)
前面我們說了JavaScript是單線程的鳄虱，單線程就意味著所有任務(wù)都需要排隊(duì)弟塞，只有前一個(gè)任務(wù)執(zhí)行完了，才會(huì)去執(zhí)行下一個(gè)任務(wù)拙已，如果前一個(gè)任務(wù)耗時(shí)很長决记，那么后一個(gè)任務(wù)就不得不一直等著，這樣導(dǎo)致的問題是：如果js執(zhí)行時(shí)間過長就會(huì)造成頁面渲染不連貫倍踪，導(dǎo)致頁面加載渲染阻塞的感覺系宫。為了解決這個(gè)問題，所以就出現(xiàn)了同步任務(wù)建车、異步任務(wù)扩借。
1、同步任務(wù)：在主線程上執(zhí)行癞志，形成一個(gè)執(zhí)行棧往枷，只有前一個(gè)任務(wù)結(jié)束后，才能執(zhí)行后一個(gè)任務(wù)凄杯。
2错洁、異步任務(wù)：不進(jìn)入主線程，而是進(jìn)入任務(wù)隊(duì)列戒突，當(dāng)主線程的任務(wù)都執(zhí)行完了屯碴，才會(huì)從任務(wù)隊(duì)列中取出異步任務(wù)放入主線程中執(zhí)行。
宏任務(wù)（macrotask ）和微任務(wù)（microtask ）
macrotask和microtask表示異步任務(wù)的兩種分類膊存。
在任務(wù)掛起時(shí)导而，js引擎會(huì)將所有任務(wù)按照類別分到這兩個(gè)隊(duì)列中忱叭，首先在macrotask的隊(duì)列中取出第一個(gè)任務(wù)，執(zhí)行完畢后今艺，取出microtask隊(duì)列中的所有任務(wù)按順序執(zhí)行韵丑；之后再取macrotask任務(wù)，如此周而復(fù)始虚缎，直到兩個(gè)隊(duì)列的任務(wù)都取完撵彻。
宏任務(wù)： setTimeout | setInterval | setImmediate | requestAnimationFrame
微任務(wù)： process.nextTick | MutationObserver | Promise.then catch finally
preocess.nextTick優(yōu)先級(jí)大于promise.then
js的異步運(yùn)行機(jī)制如下：
1、所有同步任務(wù)都在主線程上執(zhí)行实牡，形成一個(gè)執(zhí)行棧陌僵；
2、主線程之外创坞，還有一個(gè)任務(wù)隊(duì)列碗短，只要異步任務(wù)有了結(jié)果，就在任務(wù)隊(duì)列中放置一個(gè)事件题涨；
3偎谁、執(zhí)行棧中所有同步任務(wù)執(zhí)行完畢，系統(tǒng)就會(huì)讀取任務(wù)隊(duì)列纲堵，看看有哪些事件搭盾，那些對(duì)應(yīng)的異步任務(wù)，于是結(jié)束等待婉支，進(jìn)入執(zhí)行棧鸯隅，開始執(zhí)行。
事件輪詢（Event Loop）
由于主線程不斷的重復(fù)獲得任務(wù)向挖、執(zhí)行任務(wù)蝌以，所以這種機(jī)制被稱為事件輪詢。
盜下大佬的圖
這個(gè)??很好
//主線程直接執(zhí)行
console.log('1');
//丟到宏事件隊(duì)列中
setTimeout(function() {
console.log('2');
process.nextTick(function() {
console.log('3');
})
new Promise(function(resolve) {
console.log('4');
resolve();
}).then(function() {
console.log('5')
})
})
//微事件1
process.nextTick(function() {
console.log('6');
})
//主線程直接執(zhí)行
new Promise(function(resolve) {
console.log('7');
resolve();
}).then(function() {
//微事件2
console.log('8')
})
//丟到宏事件隊(duì)列中
setTimeout(function() {
console.log('9');
process.nextTick(function() {
console.log('10');
})
new Promise(function(resolve) {
console.log('11');
resolve();
}).then(function() {
console.log('12')
})
})
首先瀏覽器執(zhí)行js進(jìn)入第一個(gè)宏任務(wù)進(jìn)入主線程, 直接打印console.log('1')
遇到 setTimeout 分發(fā)到宏任務(wù)Event Queue中
遇到 process.nextTick 丟到微任務(wù)Event Queue中
遇到 Promise何之， new Promise 直接執(zhí)行 輸出 console.log('7');
執(zhí)行then 被分發(fā)到微任務(wù)Event Queue中
第一輪宏任務(wù)執(zhí)行結(jié)束跟畅，開始執(zhí)行微任務(wù) 打印 6,8
第一輪微任務(wù)執(zhí)行完畢，執(zhí)行第二輪宏事件溶推，執(zhí)行setTimeout
先執(zhí)行主線程宏任務(wù)徊件，在執(zhí)行微任務(wù)，打印'2,4,3,5'
在執(zhí)行第二個(gè)setTimeout,同理打印 ‘9,11,10,12’
整段代碼蒜危，共進(jìn)行了三次事件循環(huán)虱痕，完整的輸出為1，7辐赞，6部翘，8，2响委，4新思，3窖梁，5，9夹囚，11纵刘，10，12荸哟。
