JavaScript定時器 setTimeout 和 setInterval 異同

Michael_Lin 發布于2019-08-23 12:49 / 789人閱讀

摘要：若是函數，則只需要寫函數名，可以不加雙引號和括號必需。返回值返回整型定時器也就是這個的唯一標示符。取消定時器利用取消運行機制性能性能較優穩定性更穩定鏈式調用實現作用域相關經典面試題為每個定時器處理函數創建不同的變量副本。

		setTimeout	setInterval
描述		實現的是根據給定的時間間隔，每隔一段時間調用一次函數或執行一次代碼	實現的是根據給定的時間，在經過該時間之后只調用一次函數或執行一次代碼
語法		setTimeout (callback, delay, arg1, ..., argn)	setInterval (callback, interval, arg1, ..., argn)
參數	callback	必需。要調用的函數或要執行的代碼串。（若是函數，則只需要寫函數名，可以不加雙引號和括號）
	delay / interval	必需。在執行代碼前需等待的毫秒數。
	arg1, ..., argn	可選。給回調函數的傳參。
返回值		返回整型定時器id,也就是這個setTimeout/setInterval 的唯一標示符。
取消定時器		利用 clearTimeout(id) 取消
運行機制
性能			性能較優
穩定性		更穩定

var interval = 3 * 1000,
    count = 0;
function someOpration(){
    var startTime = new Date();
    console.log(startTime.toLocaleString() + " " + startTime.getMilliseconds());
    var sum = 0;
    for(let i=0; i < 2000000000; i++){
        sum += i;
    }
    var endTime = new Date();
    console.log(endTime.toLocaleString() + " " + endTime.getMilliseconds());
    var duration = endTime - startTime;
    console.log(duration);
}

setTimeout 鏈式調用

function slow1(){
    if(count < 5){
        someOpration();
        count = count + 1;
        setTimeout(slow1, interval);
    }
}
setTimeout(slow1, interval);

setInterval 實現

var interval = 3 * 1000,
    count = 0;
function slow2(){
    if(count < 5){
        someOpration();
        count = count + 1;
    } else {
        clearTimeout(timerId);
    }
}
var timerId = setInterval(slow2, interval)

setTimeout作用域相關經典面試題

for (var i = 1; i <= 2; i++) {
    setTimeout(function() { alert(i) }, 100);
}
// 3
// 3

為每個定時器處理函數創建不同的“i”變量副本。比如這樣

for (var i = 1; i <= 2; ++i){
  doSetTimeout(i);
}
function doSetTimeout(i) {
  setTimeout(function() { alert(i); }, 100);
}

可簡寫為

for (var i = 1; i <= 2; i++) {
    setTimeout(function(j) { console.log(j) }, 100, i);
}

云服務器 GPU云服務器 js定時器SetInterval js定時器setTimeout javascript settimeout javascript 定時器

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/99024.html

瀏覽器與NodeJS的EventLoop異同，以及部分機制。

摘要：瀏覽器與的異同，以及部分機制有人對部分迷惑，本身構造函數是同步的，是異步。瀏覽器的的已全部分析完成，過程中引用阮一峰博客，知乎，部分文章內容，侵刪。瀏覽器與NodeJS的EventLoop異同，以及部分機制 PS：有人對promise部分迷惑，Promise本身構造函數是同步的，.then是異步。---- 2018/7/6 22：35修改 javascript 是一門單線程的腳本...

jubincn 2019-08-22 18:32 評論0 收藏0
JavaScript 定時器

摘要：定時器方法相關方法有四種。返回值返回值是一個正整數，表示定時器的編號。這個值可以傳遞給來取消該定時器。使用方法很簡單只有一個參數，該參數為您要取消定時器的標識符。用法很簡單當代碼運行到這行的時候，會取消所設置的定時器。簡單介紹在JavaScript中定時器有兩個 setInterval() 與 setTime...

王偉廷 2021-11-22 15:29 評論0 收藏0
JS 異步的實現

摘要：由于引擎同一時間只執行一段代碼這是由單線程的性質決定的，所以每個代碼塊阻塞了其它異步事件的進行。這意味著瀏覽器將等待著一個新的異步事件發生。異步的任務執行的順序是不固定的，主要看返回的速度。我們經常說JS是單線程的，比如node.js研討會上大家都說JS的特色之一是單線程的，這樣使JS更簡單明了，可是大家真的理解所謂JS的單線程機制嗎？單線程時，基于事件的異步機制又該當如何，這些知識...

sihai 2019-08-22 11:14 評論0 收藏0
細說 Javascript 拾遺篇（四） : setTimeout 和 setInterval

摘要：當間隔時間設置較小時，將會導致回調函數堆積。處理可能阻塞的代碼最簡單且最可控的方式就是在回調函數內部使用函數。但是很明顯，由于指定最大值的限制，還會有定時器沒有被清除掉。另外，盡量避免使用函數，從而避免可能導致的回調函數堆積現象。由于 Javascript 是異步的，因此我們可以通過 setTimeout 和 setInterval 函數來指定特定時間執行代碼。 function ...

wangjuntytl 2019-08-19 14:49 評論0 收藏0