JavaScript setInterval：一定間隔でコードを実行する方法

setInterval関数の基本構文

setInterval関数は以下の形式で記述します。

const intervalId = setInterval(function, milliseconds);

• intervalId: setInterval関数によって返されるID
• function: 実行したい関数
• milliseconds: 関数を実行する間隔（ミリ秒単位）

例：1秒ごとにカウントアップする

let count = 0; const intervalId = setInterval(() => { count++; console.log(`カウント：${count}`); }, 1000); // 1秒ごとに実行 // 5秒後にカウントを停止 setTimeout(() => { clearInterval(intervalId); }, 5000);

このコードは、1秒ごとにcount変数を1ずつ増やし、コンソールにカウント値を出力します。

5秒後にclearInterval関数を使って、setInterval関数によって実行される処理を停止します。

setInterval関数の注意点

• setInterval関数によって実行される処理は、ブラウザが閉じられるまで続けて実行されます。
• 処理が重い場合、ブラウザの動作が遅くなる可能性があります。
• 処理を停止したい場合は、clearInterval関数を使う必要があります。

setInterval関数の応用例

• アニメーション
• リアルタイムな情報更新
• カウントダウンタイマー
• スライドショー

まとめ

setInterval関数は、Webページに動きを加えたり、リアルタイムな情報更新を実現したりするのに便利な関数です。

本記事を参考に、setInterval関数を活用して、より魅力的なWebページを作成しましょう。