JavaScript文法——定時器

1. 定時器的介紹

定時器就是在一段特定的時間後執行某段程式代碼。

2. 定時器的使用：

js 定時器有兩種建立方式：

1. setTimeout(func[, delay, param1, param2, …]) ：以指定的時間間隔（以毫秒計）調用一次函數的定時器
2. setInterval(func[, delay, param1, param2, …]) ：以指定的時間間隔（以毫秒計）重複調用一個函數的定時器

setTimeout函數的參數說明:

• 第一個參數 func , 表示定時器要執行的函數名
• 第二個參數 delay, 表示時間間隔，預設是0，機關是毫秒
• 第三個參數 param1, 表示定時器執行函數的第一個參數，一次類推傳入多個執行函數對應的參數。

<script> 
    function hello(){ 
        alert('hello'); 
    } 

    // 執行一次函數的定時器
    setTimeout(hello, 500);
</script>      

setInterval函數的參數說明:

• 第一個參數 func , 表示定時器要執行的函數名
• 第二個參數 delay, 表示時間間隔，預設是0，機關是毫秒
• 第三個參數 param1, 表示定時器執行函數的第一個參數，一次類推傳入多個執行函數對應的參數。

<script> 
    function hello(){ 
        alert('hello'); 
    } 
    // 重複執行函數的定時器
    setInterval(hello, 1000);
</script>      

2. 清除定時器

js 清除定時器分别是:

• clearTimeout(timeoutID) 清除隻執行一次的定時器(setTimeout函數)
• clearInterval(timeoutID) 清除反複執行的定時器(setInterval函數)

• timeoutID 為調用 setTimeout 函數時所獲得的傳回值，使用該傳回辨別符作為參數，可以取消該 setTimeout 所設定的定時執行操作。

<script>
    function hello(){
        alert('hello');
        // 清除隻執行一次的定時器
        clearTimeout(t1)
    }
    // 執行一次函數的定時器
    t1 = setTimeout(hello, 500);
</script>      

• timeoutID 為調用 setInterval 函數時所獲得的傳回值，使用該傳回辨別符作為參數，可以取消該 setInterval 所設定的定時執行操作。

<script> 
    function hello(){ 
        alert('hello'); 
    } 
    // 重複執行函數的定時器
    var t1 = setInterval(hello, 1000);

    function stop(){
        // 清除反複執行的定時器
        clearInterval(t1); 
    }  

</script> 

<input type="button" value="停止" onclick="stop();">      

5. 小結

• 定時器的建立

• 隻執行一次函數的定時器, 對應的代碼是setTimeout函數
• 反複執行函數的定時器, 對應的代碼是setInterval函數

• 清除定時器

• 清除隻執行一次函數的定時器, 對應的代碼是clearTimeout函數
• 清除清除反複執行的定時器, 對應的代碼是clearInterval函數