理解使用setTimeout和setInterval
阿新 • • 發佈:2018-12-18
setTimeout和setInterval
要充分理解javaScript是運行於單執行緒環境的。
在javaScript中沒有任何程式碼是立即執行的,但是一旦程序空閒下來就會盡快執行
setTimeout:指定的毫秒數後呼叫函式(引用函式)或計算表示式(js程式碼串)
//呼叫函式 function a() { console.log(1231); } setTimeout(a, 1000); // 計算表示式 function b(val) { console.log(val); } setTimeout('b(1234)', 1000); // 計算表示式 setTimeout('console.log(12312312);', 1000); // 呼叫函式方式由於不能傳參,可以通過閉包來實現。 function foo(a1,a2,a3){ return function () { console.log(a1,a2,a3); } } var c = foo(1,2,3); setTimeout(c,1000); // 對比var a = function(){} ;類似 setTimeout(function(a){ console.log(a) },1000);
setTimeout定時器會在主執行緒空閒時會在指定時間後執行任務,若主執行緒忙碌狀態,則會先把任務掛在非同步佇列,待主執行緒空閒後立即在指定時間後執行,所以實際發生前時間大於等於設定的時間
setInterval:可按照指定的週期(以毫秒計)來呼叫函式或計算表示式
- 問題:定時器程式碼在程式碼再次被新增到佇列之前沒有執行完成,導致定時器程式碼執行了好幾遍setInterval。
- 缺點:1.某些間隔被跳過 2.多個定時器程式碼的執行間隔比預期小
解決上述兩個缺點。可以採用鏈式setTimeout呼叫
setTimeout(function () { setTimeout(arguments.callee, interval); }, interval); arguments.callee對當前執行函式的引用