このページでは、JavaScriptのタイマーに関する主要な機能とその使い方を解説します。

• setTimeoutの解説
• clearTimeoutの解説
• setIntervalの解説
• clearIntervalの解説

setTimeoutの解説

setTimeoutは、指定した時間が経過した後に一度だけ関数を実行するためのタイマー機能です。

構文

let timerID = setTimeout(func, msec, arg1, arg2, ...);

• func: 実行する関数
• msec: 遅延時間（ミリ秒単位）
• arg1, arg2, ...: 関数に渡す引数（任意）
• timerID: タイマー識別子

例: 2秒後にメッセージを表示

setTimeout(() => {
    console.log("2秒後に表示されるメッセージ");
}, 2000);

例: 引数を渡す

function greet(name) {
    console.log(`こんにちは、${name}さん！`);
}

setTimeout(greet, 3000, "太郎");

clearTimeoutの解説

clearTimeoutは、setTimeoutによって設定されたタイマーをキャンセルするためのメソッドです。

構文

clearTimeout(timerID);

• timerID: キャンセルするタイマーの識別子

例: タイマーをキャンセル

let timerID = setTimeout(() => {
    console.log("このメッセージは表示されません");
}, 5000);

clearTimeout(timerID);

setIntervalの解説

setIntervalは、指定した時間間隔ごとに繰り返し関数を実行するためのタイマー機能です。

構文

let intervalID = setInterval(func, msec, arg1, arg2, ...);

• func: 実行する関数
• msec: 実行間隔（ミリ秒単位）
• arg1, arg2, ...: 関数に渡す引数（任意）
• intervalID: タイマー識別子

例: 1秒ごとにメッセージを表示

let count = 0;
let intervalID = setInterval(() => {
    count++;
    console.log(`1秒ごとに表示: ${count}`);
    if (count === 5) {
        clearInterval(intervalID);
    }
}, 1000);

例: 引数を渡す

function repeatMessage(message) {
    console.log(message);
}

let intervalID = setInterval(repeatMessage, 2000, "2秒ごとに繰り返し表示されるメッセージ");

clearIntervalの解説

clearIntervalは、setIntervalによって設定されたタイマーを停止するためのメソッドです。

構文

clearInterval(intervalID);

• intervalID: 停止するタイマーの識別子

例: タイマーを停止

let intervalID = setInterval(() => {
    console.log("繰り返し表示されるメッセージ");
}, 1000);

setTimeout(() => {
    clearInterval(intervalID);
    console.log("タイマーを停止しました");
}, 5000);

これらのタイマー機能を使用することで、JavaScriptで柔軟な時間管理が可能になります。