調(diào)用堆棧
眾所周知JavaScript是單線程編程語(yǔ)言，它只有一個(gè)單一的調(diào)用堆棧，當(dāng)調(diào)用堆棧由函數(shù)在運(yùn)行固惯，它就不能做其他任何事。調(diào)用堆棧是一個(gè)可以記錄當(dāng)前執(zhí)行程序所在位置的數(shù)據(jù)結(jié)構(gòu)缴守，調(diào)用堆棧中的每個(gè)部分稱為堆棧幀葬毫。比如下列代碼：
var end = () => {
throw new Error('There is a Error!');
}
var second = () => {
end();
}
var start = () => {
second();
}
start();
在chrome中執(zhí)行就會(huì)產(chǎn)生以下拋出的異常堆棧跟蹤，這也正是異常發(fā)生時(shí)的調(diào)用堆棧狀態(tài)：
如果在chrome中執(zhí)行一個(gè)遞歸調(diào)用自身而且沒有任何終止條件的函數(shù)屡穗，會(huì)導(dǎo)致調(diào)用堆棧中的函數(shù)調(diào)用超過了調(diào)用堆棧的實(shí)際大小贴捡，瀏覽器會(huì)拋出一個(gè)錯(cuò)誤：
由于JavaScript單一調(diào)用堆棧的特效，導(dǎo)致了當(dāng)在調(diào)用堆棧中進(jìn)行的函數(shù)需要大量時(shí)間才能處理時(shí)村砂，瀏覽器會(huì)處于等待狀態(tài)烂斋，不會(huì)運(yùn)行其他代碼，甚至可能會(huì)停止響應(yīng)础废，那么要如何解決呢汛骂？
事件循環(huán)
解決方案就是異步回調(diào)。
這里就要先介紹一下事件循環(huán)
雖然JavaScript有很多允許異步的代碼（如setTimeout评腺，AJAX等）帘瞭，但是JavaScript引擎只會(huì)在同一時(shí)刻執(zhí)行一個(gè)程序。JavaScript引擎運(yùn)行在一個(gè)宿主環(huán)境中（通常是瀏覽器或者node）蒿讥，宿主環(huán)境中有一個(gè)事件循環(huán)的內(nèi)置機(jī)制蝶念，會(huì)根據(jù)時(shí)間順序去調(diào)用js引擎去執(zhí)行程序。
事件循環(huán)的任務(wù)只有一個(gè)芋绸，就是去監(jiān)控調(diào)用棧和回調(diào)隊(duì)列媒殉，當(dāng)調(diào)用棧為空時(shí)，它會(huì)將取出隊(duì)列中的第一個(gè)事件摔敛，放入到調(diào)用棧中執(zhí)行廷蓉。這樣的迭代在事件循環(huán)中被稱為一個(gè)tick。
在chrome中運(yùn)行下面的代碼：
console.log('first!');
setTimeout(() => console.log('second!'), 500);
console.log('third!');
會(huì)出現(xiàn)如下結(jié)果：
這就是一個(gè)典型的異步回調(diào)马昙！
當(dāng)調(diào)用棧按順序執(zhí)行到setTimeout()函數(shù)時(shí)苦酱，它會(huì)將其移出調(diào)用棧售貌，但也不會(huì)直接放入隊(duì)列中，而是設(shè)置一個(gè)定時(shí)器疫萤，待定時(shí)器過期以后颂跨，宿主環(huán)境才會(huì)將回調(diào)放入隊(duì)列中，當(dāng)調(diào)用棧清空時(shí)扯饶，就會(huì)從隊(duì)列中取出并這個(gè)回調(diào)恒削。
以上的這種回調(diào)容易造成回調(diào)地獄，所以ES6中又提出Promise函數(shù),還有ES8中的async/await函數(shù)尾序，來優(yōu)化異步模式钓丰。
