setTimeout() 方法用于在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式。
看到這樣一個(gè)說明,我們明白了它就是一個(gè)定時(shí)器,我們設(shè)定的函數(shù)就是一個(gè)"鬧鐘",時(shí)間到了它就會去執(zhí)行
<script>
alert(1);
setTimeout("alert(2)", 0);
alert(3);
</script>
如果settimeout(0)會立即執(zhí)行,那么這里的執(zhí)行結(jié)果就應(yīng)該是1->2>3 . 然而實(shí)際的結(jié)果卻是1->3->2. 這說明了settimeout(0)并不是立即執(zhí)行
引擎單線程執(zhí)行的,它是基于事件驅(qū)動的語言.它的執(zhí)行順序是遵循一個(gè)叫做事件隊(duì)列的機(jī)制.從圖中我們可以看出,瀏覽器有各種各樣的線程,比如事件觸發(fā)器,網(wǎng)絡(luò)請求,定時(shí)器等等.線程的聯(lián)系都是基于事件的.js引擎處理到與其他線程相關(guān)的代碼,就會分發(fā)給其他線程,他們處理完之后,需要js引擎計(jì)算時(shí)就是在事件隊(duì)列里面添加一個(gè)任務(wù). 這個(gè)過程中,js并不會阻塞代碼等待其他線程執(zhí)行完畢,而且其他線程執(zhí)行完畢后添加事件任務(wù)告訴js引擎執(zhí)行相關(guān)操作.這就是js的異步編程模型.
如此我們再回過頭來看settimeout(0)就會恍然大悟.js代碼執(zhí)行到這里時(shí),會開啟一個(gè)定時(shí)器線程,然后繼續(xù)執(zhí)行下面的代碼.該線程會在指定時(shí)間后往事件隊(duì)列里面插入一個(gè)任務(wù).由此可知settimeout(0)里面的操作會放在所有主線程任務(wù)之后. 這也就解釋了為什么第一個(gè)實(shí)驗(yàn)結(jié)果是1->3-2
當(dāng)一個(gè)事件被觸發(fā)時(shí)該線程會把事件添加到待處理隊(duì)列的隊(duì)尾,等待JS引擎的處理。這些事件可來自JavaScript引擎當(dāng)前執(zhí)行的代碼塊如setTimeOut、也可來自瀏覽器內(nèi)核的其他線程如鼠標(biāo)點(diǎn)擊、AJAX異步請求等,但由于JS的單線程關(guān)系所有這些事件都得排隊(duì)等待JS引擎處理。