ホーム > カテゴリ > 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





関連記事



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


この記事を書いた人

💻 ITスキル・経験
サーバー構築からWebアプリケーション開発。IoTをはじめとする電子工作、ロボット、人工知能やスマホ/OSアプリまで分野問わず経験。

画像処理/音声処理/アニメーション、3Dゲーム、会計ソフト、PDF作成/編集、逆アセンブラ、EXE/DLLファイルの書き換えなどのアプリを公開。詳しくは自己紹介へ
プチモンテ代表、アーティスト名:プチモンテ
🎵 音楽制作
BGMは楽器(音源)さえあれば、何でも制作可能。歌モノは主にロック、バラード、ポップスを制作。歌詞は叙情詩、叙情的な楽曲が多い。楽曲制作は2023年12月中旬 ~

オリジナル曲を始めました✨

YouTubeで各楽曲を公開しています🌈
https://www.youtube.com/@petitmonte

【男性ボーカル】DA・KA・RA | 新たな明日が風と共に訪れる

【男性、女性ボーカル】時空を超越する先に | 時空と風の交響曲

【女性、男性ボーカル】絆 | 穏やかな心に奏でる旋律