ホーム > カテゴリ > HTML5・JavaScript >

JavaScriptでタイマーを使用する[setTimeout/setInterval]

JavaScriptのタイマーは2種類あります。

1つ目は指定時間後に1回だけ発動するsetTimeout()、2つ目は指定間隔でキャンセルされるまで半永久的に発動するsetInterval()です。

setTimeout - 指定された時間後に発動する

次のサンプルは3秒後にアラートを表示します。

<script>
 // 3秒後に発動する
 setTimeout(function() {
   alert('3秒経過しました。');
 }, 3000);
</script>

第二引数はミリ秒を指定します。1秒=1000ミリ秒です。

setInterval - 指定された間隔で発動する

1秒毎に値を出力して7回出力したらタイマーを終了します。

<script>
 var intervalID; // タイマーID
 var value = 0;   
 
 function addValue(){
   
   value++;
   
   // 値を出力
   document.write(value);
   
   // 値が7になったらタイマーをキャンセルする
   if(value == 7){
     document.write('<br>タイマーがキャンセルされました。');
     clearInterval(intervalID);
   }
 }
 
 // タイマーの発動(1秒おき) 
 intervalID = setInterval(addValue, 1000);
 
</script>

タイマーの終了(キャンセル)はsetInterval()の戻り値のintervalIDをclearInterval()の引数に渡します。

外部リンク(MDN)

setTimeout setInterval clearInterval





関連記事


前の記事：Promiseを使用して複数のファイルを連続して読み込む[IE対応版]
次の記事：顔検出・顔認識をJavaScriptで実行する[CCV.js]

公開日：2016年05月25日
記事NO：01978