[JavaScript] 基本メモ: タイマー処理

タイマー関数

指定した間隔ごとにコールバック関数を呼び出す

setInterval(コールバック関数, 間隔)

指定した時間経過したらコールバック関数を呼び出す

setTimeout(コールバック関数, 時間)

setInterval()使用上の注意

setInterval()は、以前に呼び出したコールバック関数の処理が終わっているかどうかに関わらず、時間が経過したら新たにコールバック関数を呼び出してしまう。もしコールバック関数の処理に時間が掛かっていると、以前のコールバック関数が終了する前に新しくコールバック関数が呼び出されることになり、結果的に処理中のコールバック関数が増えすぎてシステムリソースを食い潰してしまうこともあり得る。

setTimeout()を使ったインターバル処理

以下のように再帰的にsetTimeout()を呼び出すことで、安全にインターバル処理を行うこともできる。

var cnt = 0;
function incr() {
    console.log(cnt++);
    setTimer(function(){incr();}, 1000);
}
incr();

たとえば、もし60秒でインクリメント処理を終えたい場合は以下のようにすればよい。

var cnt = 0;
function incr() {
    console.log(cnt++);
    var tid = setTimer(function(){incr();}, 1000);
    if (cnt > 60) {
        clearTimeout(tid);
    }
}
incr();