淺談JavaScript中setInterval和setTimeout的使用問(wèn)題
說(shuō)到setInterval，就不得不提到setTimeout，二者都是用于定時(shí)執(zhí)行某函數(shù)，區(qū)別在于setTimeout 只執(zhí)行一次，而setInterval可以一直連續(xù)不斷執(zhí)行下去，典型用法如下：
function do_sth() { console.log('Hello...'); }
setTimeout(do_sth, 2500); // 2.5 秒后，執(zhí)行 do_sth 函數(shù)（只執(zhí)行一次） setInterval(do_sth, 3500); // 3.5 秒后，執(zhí)行 do_sth 函數(shù)（每隔 3.5 秒執(zhí)行一次，一直執(zhí)行下去）
表面看上去，二者各有各的用途，沒(méi)什么問(wèn)題。但是如果setInterval所執(zhí)行的函數(shù)是比較耗時(shí)的動(dòng)作，setInterval仍然會(huì)按照原計(jì)劃安排調(diào)用那個(gè)函數(shù)，而不考慮之前的任何阻塞，這樣隨著時(shí)間的推移，隊(duì)列中等待執(zhí)行的函數(shù)就會(huì)越來(lái)越多。而對(duì)于此問(wèn)題解決方案仍然是采用遞歸調(diào)用setTimeout 的方法，如：
function do_sth() {
console.log('Hello...'); // 即使這里執(zhí)行比較耗時(shí)的動(dòng)作也沒(méi)問(wèn)題，
// 等這里執(zhí)行完了才會(huì)再去調(diào)用 setTimeout
setTimeout(do_sth, 2500); // 安排后續(xù)執(zhí)行
}
do_sth(); // 初次執(zhí)行
這種遞歸調(diào)用的方式，既可以達(dá)到循環(huán)執(zhí)行某函數(shù)的目的，有可以防止后續(xù)任務(wù)不斷堆積。
如果你覺(jué)得這種方式有點(diǎn)羅嗦，還可以再寫(xiě)得精煉一些：
(function() {
console.log('Hello...'); // do something here
setTimeout(arguments.callee, 2500);
})();
說(shuō)是這么說(shuō)，但是如果定時(shí)執(zhí)行的任務(wù)開(kāi)銷(xiāo)很少，setInterval一般是沒(méi)什么問(wèn)題的，但是如果任務(wù)開(kāi)銷(xiāo)比較大，請(qǐng)務(wù)必使用setTimeout。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了JavaScript的DOM事件，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助2022-02-02
下面小編就為大家?guī)?lái)一篇JS操作DOM的一些常用方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
這篇文章主要介紹了JavaScript中的Math.E屬性使用詳解,是JS入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-06-06
帶你了解session和cookie作用原理區(qū)別和用法
這篇文章主要介紹了session和cookie作用原理,區(qū)別和用法,以及使用過(guò)程中的優(yōu)缺點(diǎn)，通過(guò)列舉區(qū)別和原理，使讀者更能理解兩者之間的關(guān)系,需要的朋友可以參考下2017-08-08
JavaScript中對(duì)JSON對(duì)象的基本操作示例
JSON格式本就發(fā)自于JavaScript中的對(duì)象和數(shù)組,所以js操作起來(lái)自然也是最為簡(jiǎn)單原始,接下來(lái)我們就來(lái)看一些常用的JavaScript中對(duì)JSON對(duì)象的基本操作示例2016-05-05
優(yōu)化RequireJS項(xiàng)目的相關(guān)技巧總結(jié)
這篇文章主要介紹了優(yōu)化RequireJS項(xiàng)目的相關(guān)技巧總結(jié),RequireJS是一個(gè)人氣JavaScript庫(kù),需要的朋友可以參考下2015-07-07
javascript 多瀏覽器 事件大全 ，對(duì)于一些事件的使用限制于觸發(fā)方法可以參考下。2010-03-03
下面的代碼在HTML中是有效的，但在XHTML中則是無(wú)效的接下來(lái)為大家介紹下JavaScript在XHTML中的用法，感興趣的朋友可以參考下哈2013-04-04
JavaScript 遞增、遞減運(yùn)算符實(shí)例
遞增、遞減運(yùn)算符實(shí)例，基礎(chǔ)Js代碼范例，新手可參考哦。2010-07-07
淺談js基本數(shù)據(jù)類(lèi)型和typeof
下面小編就為大家?guī)?lái)一篇淺談js基本數(shù)據(jù)類(lèi)型和typeof。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-08