兩種方法：1、用clearTimeout()清除setTimeout定時(shí)器，語法“clearTimeout(定時(shí)器返回值)”；2、clearInterval()清除setInterval定時(shí)器，語法“clearInterval(返回值)”。

本教程操作環(huán)境：windows7系統(tǒng)、ECMAScript 6版、Dell G3電腦。

JS的兩種定時(shí)器

window.setTimeout([function],[interval])

設(shè)置一個(gè)定時(shí)器，并且設(shè)定了一個(gè)等待的時(shí)間，當(dāng)?shù)竭_(dá)時(shí)間后，執(zhí)行對(duì)應(yīng)的方法，當(dāng)方法執(zhí)行完成定時(shí)器停止。

window.setInterval([function],[interval])

設(shè)置一個(gè)定時(shí)器，并且設(shè)定了一個(gè)等待的時(shí)間，當(dāng)?shù)竭_(dá)時(shí)間后，執(zhí)行對(duì)應(yīng)的方法。

當(dāng)方法執(zhí)行完成，定時(shí)器并沒有停止，以后每隔這么長的時(shí)間都會(huì)重新的執(zhí)行對(duì)應(yīng)的方法，直到我們手動(dòng)清除定時(shí)器為止。

注意：setTimeout() 只執(zhí)行 code 一次。如果要多次調(diào)用，請(qǐng)使用 setInterval() 或者讓 code 自身再次調(diào)用 setTimeout()。

定時(shí)器返回值

JS中的定時(shí)器是有返回值的，返回值是一個(gè)數(shù)字，代表當(dāng)前是第幾個(gè)定時(shí)器。

var timer1=window.setTimeout(function(){},1000);  //timer1->1 當(dāng)前是第一個(gè)定時(shí)器 var timer2=window.setTimeout(function(){},1000);  //timer2->2` 當(dāng)前是第二個(gè)定時(shí)器 var timer3=window.setTimeout(function(){},1000);   //timer3->3 當(dāng)前是第三個(gè)定時(shí)器

需要注意的是，定時(shí)器即使清除了，其返回值也不會(huì)清除，之后設(shè)置的定時(shí)器的返回值也會(huì)在其返回值的基礎(chǔ)上繼續(xù)向后排。

怎么清除定時(shí)器

若不及時(shí)清理定時(shí)器，可能會(huì)導(dǎo)致內(nèi)存溢出的風(fēng)險(xiǎn)。所以當(dāng)我們在使用定時(shí)器的時(shí)候，就需要考慮在合適的時(shí)間清除。

清除定時(shí)器有兩個(gè)函數(shù)：

• setTimeout的銷毀函數(shù)為clearTimeout

• setInterval的銷毀函數(shù)為clearInterval

setInterval對(duì)象或setTimeout對(duì)象，這兩種定時(shí)器對(duì)象只會(huì)隨著窗口對(duì)象的銷毀才從棧空間回收。無法通過更改變量的指針指向null的方式通知垃圾回收機(jī)自動(dòng)回收。如果打算在窗口對(duì)象關(guān)閉之前銷毀窗口對(duì)象的棧內(nèi)存中的setInterval對(duì)象只能通過clearInterval銷毀它

clearTimeout(id_of_settimeout)

定義：阻止/取消 setTimeout() 方法設(shè)置的定時(shí)執(zhí)行函數(shù)。

參數(shù)：id_of_settimeout是調(diào)用 setTimeout() 函數(shù)時(shí)所返回的ID值，使用該返回標(biāo)識(shí)符作為參數(shù)，可以取消該 setTimeout() 所設(shè)定的定時(shí)執(zhí)行操作。

注意: 要使用 clearTimeout(id_of_setinterval) 方法, 在創(chuàng)建執(zhí)行定時(shí)操作時(shí)要使用全局變量：

var myVar = setTimeout(function(){ alert("Hello"); }, 3000); clearTimeout(myVar);

• 是否需要及時(shí)清理setTimeOut

function testTimeout () { 	console.log('1111') 	console.log(setTimeout(testTimeout, 3000)); }

上面代碼在遞歸調(diào)用testTimeout，然而setTimeout會(huì)一直生成setTimeout對(duì)象；雖然會(huì)被GC回收但時(shí)間不確定，這樣做比較危險(xiǎn)，可能會(huì)導(dǎo)致內(nèi)存溢出。

所以我們應(yīng)該在每次 setTimeout 之前調(diào)用 clearTimeout，防止不斷創(chuàng)建setTimeout對(duì)象而未被GC回收。

var timeHandle = null; function testTimeout () {     if (timeHandle) {     	// 調(diào)用之前，先清理，防止一直生成對(duì)象     	// ps. setInterval 定時(shí)器也應(yīng)該按這種模式處理     	clearTimeout(timeHandle);         timeHandle = null;     } 	console.log('1111'); 	console.log(timeHandle = setTimeout(testTimeout, 3000)); }

clearInterval(id_of_setinterval)

定義： 可取消/停止由 setInterval() 函數(shù)設(shè)定的定時(shí)執(zhí)行操作。

參數(shù)：id_of_setinterval是調(diào)用 setInterval() 函數(shù)時(shí)所返回的 ID 值，只有使用該返回標(biāo)識(shí)符作為參數(shù)，才可以取消該 setInterval() 所設(shè)定的定時(shí)執(zhí)行操作。

注意: 要使用 clearInterval() 方法, 在創(chuàng)建執(zhí)行定時(shí)操作時(shí)要使用全局變量：

var myVar = setInterval(function(){ myTimer() }, 1000); clearInterval(myVar);

• 是否需要及時(shí)清理setInterval

function testInterval () { 	console.log('1111') 	console.log(setInterval(testInterval, 3000)); }

上面代碼在遞歸調(diào)用testInterval，然而setInterval會(huì)一直生成setInterval對(duì)象；雖然會(huì)被GC回收但時(shí)間不確定，這樣做比較危險(xiǎn)，可能會(huì)導(dǎo)致內(nèi)存溢出。

所以我們應(yīng)該在每次 setInterval 之前調(diào)用 clearInterval，防止不斷創(chuàng)建setInterval對(duì)象而未被GC回收。

var timeHandle = null; function testInterval () {     if (timeHandle) {     	// 調(diào)用之前，先清理，防止一直生成對(duì)象     	clearInterval(timeHandle);         timeHandle = null;     } 	console.log('1111'); 	console.log(timeHandle = setInterval(testInterval, 3000)); }

擴(kuò)展知識(shí)：使用setTimeout模擬setInterval行為

通常情況下：遞歸的方式使用setTimeOut()，效果相當(dāng)于使用setInterval()

好處：

• 簡化代碼

• 保證異步隊(duì)列的函數(shù)調(diào)用順序的精準(zhǔn)度，setInterval的缺陷會(huì)導(dǎo)致數(shù)據(jù)量大的時(shí)候，異步隊(duì)列的函數(shù)調(diào)用出現(xiàn)執(zhí)行順序的錯(cuò)亂。比如這個(gè)函數(shù)還沒執(zhí)行完又開始執(zhí)行下一個(gè)，遞歸則不會(huì)，遞歸是當(dāng)前函數(shù)執(zhí)行完才在?？臻g遞歸創(chuàng)建函數(shù)的下一個(gè)實(shí)體并調(diào)用。

//實(shí)現(xiàn)的方法挺簡單的 ，如下代碼 //參數(shù)： 毫秒  需要執(zhí)行的方法 function console1() {     console.log(111);     if(timer){         clearTimeout(timer);     }     timer = setTimeout(function(){         console1();     }, 3000); } console1()

【