setTimeoutとsetInterval

【javascript】

最初に書いておくと、特殊な事情がない限りjavascriptでsetIntervalをしないことをオススメする。
※多分ネット上に同じようなこと色々書いてあると思うけど

あと、実行はとりあえず無名関数でやれ(Stringで関数名を指定するな)

function f(){
    console.log("!");
    setTimeout(function(){f();}, 1000);
}
f();

これが基本形。
f()を実行すると1秒ごとにコンソールに!を吐く。

setTimeoutとsetIntervalを同じ使い方で組んだ場合、一番の違いは「処理待ち」だ。
setTimeoutは一回一回1個の関数を処理するので、処理が終わってからXミリ秒後に次の関数を実行する。
ところが、setIntervalは、それ自体が独立して動いているので処理に時間がかかっていても関係なく次の関数を実行する。

この違いは一見大したことないように思えるが、何かの拍子に次の処理の開始時間までに処理が終了しないことが発生すると、処理が追いつかなくなりプログラム処理の負荷が雪だるま式に増えていく可能性がある。そうするとjavascript全体が(というかPCが)まともに動かなくなるまで重くなっていくことがあるので、こういったプログラムの作りは避けておきたい。

例えば、setTimeoutを使えば連鎖的に処理させる場合にグローバル変数を使う必要がないので、

function f(a){
    console.log(++a);
    setTimeout(function(){f(a);}, 1000);
}
f(0);

のような書き方ができる。
これは、最初に与えた数を1秒ごとに1ずつ増やしてコンソールに書き出しているが、Intervalの場合、一回一回別の関数を実行している都合上外部に変数を持たなければいけない。
また、最初に書いた処理の遅延が発生してくると、処理とパラメータの前後関係がおかしくなってくるので、さらなる混乱をもたらしてしまうことになる。

というわけで、setTimeoutを使いましょう。
それではみなさん。
Enjoy JavaScript