資訊專欄INFORMATION COLUMN
摘要：兩次結(jié)果不一致，是因為代碼執(zhí)行到定時器時，此時定時器線程開始定時，定時時間到之后，將定時回調(diào)事件推入事件隊列而最后，線程依據(jù)事件隊列中順序執(zhí)行。
最近在準(zhǔn)備面試，對于JS原理性的文章，感覺很有必要系統(tǒng)整理下，不必每一次都要查詢資料，節(jié)約時間。
問題
setTimeout(function(){
console.log("開始執(zhí)行定時器回調(diào): "+ new Date())
console.log("我是定時器")
},0)
大家覺得這個定時器定時時間設(shè)為0，有意義嗎？是否覺得上述代碼效果等同于
console.log("開始執(zhí)行定時器回調(diào): "+ new Date())
console.log("我是定時器")
實踐是檢驗真理的最好途徑。我們不排斥拿來主義，但是如果能自己實踐驗證，對于提升自身格物致知的精神很有裨益。針對上述問題，我們用兩個實驗來解開答案：
實驗一：
console.log("1")
console.log("我是定時器")
console.log("2")
打印結(jié)果
實驗二：
console.log("1")
setTimeout(function(){
console.log("我是定時器")
},0)
console.log("2")
打印結(jié)果
通過上述兩個實驗結(jié)果，我們可以得知 定時器定時為0時，JS執(zhí)行到定時器這一步，并不是直接開始執(zhí)行定時回調(diào)，而是執(zhí)行了后續(xù)代碼之后，才執(zhí)行。
那為什么會這樣呢？
我們?nèi)匀荒脙蓚€例子來說明：
實驗三：
console.log("1")
console.log("定時器線程開始計時: "+ new Date())
setTimeout(function(){
console.log("開始執(zhí)行定時器回調(diào): "+ new Date())
},5000)
for(var i=0;i<500;i++){
console.log("我是循環(huán)")
}
console.log("事件隊列最后一位: "+ new Date())
打印結(jié)果：
從結(jié)果中可以看出，從定時器線程開始定時，到定時5秒結(jié)束后，將定時回調(diào)事件放入事件隊列中執(zhí)行，用了5秒。
實驗四：
console.log("1")
console.log("定時器線程開始計時: "+ new Date())
setTimeout(function(){
console.log("開始執(zhí)行定時器回調(diào): "+ new Date())
},5000)
for(var i=0;i<50000;i++){
console.log("我是循環(huán)")
}
console.log("事件隊列最后一位: "+ new Date())
打印結(jié)果：
從結(jié)果中可以看出，從定時器線程開始定時，到定時5秒結(jié)束后，將定時回調(diào)事件放入事件隊列中執(zhí)行，用了9秒。
兩次結(jié)果不一致，是因為JS代碼執(zhí)行到定時器時，此時定時器線程開始定時，定時時間到之后，將定時回調(diào)事件推入事件隊列而最后，JS線程依據(jù)事件隊列中順序執(zhí)行。而之所以有的延時5秒，有的延時9秒，是因為如果定時器開始計時時，JS事件隊列中執(zhí)行剩余的事件小于5秒，則定時結(jié)束后，將定時回調(diào)事件推入隊列中，JS能夠立即執(zhí)行定時回調(diào)事件，所以是5秒；而如果JS事件隊列中執(zhí)行剩余的事件大于5秒，那么在定時結(jié)束后，將定時回調(diào)事件推入隊列后，還需一些時間來執(zhí)行定時回調(diào)事件之前的事件，所以為9秒。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/101920.html
摘要：如果對語法分析和預(yù)編譯，還有疑問引擎執(zhí)行的過程的理解語法分析和預(yù)編譯階段。參與執(zhí)行過程的線程分別是引擎線程也稱為內(nèi)核，負(fù)責(zé)解析執(zhí)行腳本程序的主線程例如引擎。以上便是引擎執(zhí)行宏任務(wù)的整個過程。 一、概述 js引擎執(zhí)行過程主要分為三個階段，分別是語法分析，預(yù)編譯和執(zhí)行階段，上篇文章我們介紹了語法分析和預(yù)編譯階段，那么我們先做個簡單概括，如下： 1、語法分析： 分別對加載完成的代碼塊進行語法...
摘要：如果對語法分析和預(yù)編譯，還有疑問引擎執(zhí)行的過程的理解語法分析和預(yù)編譯階段。參與執(zhí)行過程的線程分別是引擎線程也稱為內(nèi)核，負(fù)責(zé)解析執(zhí)行腳本程序的主線程例如引擎。以上便是引擎執(zhí)行宏任務(wù)的整個過程。一、概述 js引擎執(zhí)行過程主要分為三個階段，分別是語法分析，預(yù)編譯和執(zhí)行階段，上篇文章我們介紹了語法分析和預(yù)編譯階段，那么我們先做個簡單概括，如下： 1、語法分析： 分別對加載完成的代碼塊進行語法檢驗，語...
摘要：定時器線程由于是單線程運行，所以不能抽出時間來計時，只能另開辟一個線程來處理定時器任務(wù)，等計時完成，把定時器要執(zhí)行的操作添加到事件任務(wù)隊列尾，等待引擎線程來處理。已經(jīng)知道了是單線程運行的，也知道中有同步操作和異步操作。 js運行機制 本章了解一下js的運行原理，了解了js的運行原理才能寫出更優(yōu)美的代碼，提高運行效率，還能解決開發(fā)中遇到的不理解的問題。 進程與線程 進程是cpu資源分配的...
摘要：定時器線程由于是單線程運行，所以不能抽出時間來計時，只能另開辟一個線程來處理定時器任務(wù)，等計時完成，把定時器要執(zhí)行的操作添加到事件任務(wù)隊列尾，等待引擎線程來處理。已經(jīng)知道了是單線程運行的，也知道中有同步操作和異步操作。 js運行機制 本章了解一下js的運行原理，了解了js的運行原理才能寫出更優(yōu)美的代碼，提高運行效率，還能解決開發(fā)中遇到的不理解的問題。 進程與線程 進程是cpu資源分配的...
摘要：定時器線程由于是單線程運行，所以不能抽出時間來計時，只能另開辟一個線程來處理定時器任務(wù)，等計時完成，把定時器要執(zhí)行的操作添加到事件任務(wù)隊列尾，等待引擎線程來處理。已經(jīng)知道了是單線程運行的，也知道中有同步操作和異步操作。 js運行機制 本章了解一下js的運行原理，了解了js的運行原理才能寫出更優(yōu)美的代碼，提高運行效率，還能解決開發(fā)中遇到的不理解的問題。 進程與線程 進程是cpu資源分配的...
閱讀 2837·2021-11-25 09:43
閱讀 984·2021-10-11 10:57
閱讀 2491·2020-12-03 17:20
閱讀 3735·2019-08-30 14:05
閱讀 2430·2019-08-29 14:00
閱讀 1999·2019-08-29 12:37
閱讀 1672·2019-08-26 11:34
閱讀 3216·2019-08-26 10:27
