なんじゃくにっき

プログラミングの話題中心。

JavaScriptでSleep関数の代わり(1)

 JavaScriptを使っていて、ループを1周する毎にウェイトをかけたかったのだが、
JavaScriptにはSleep関数がない(Flexもだけど。Flashにはタイムラインがあるのに…)。


 ので、ググってみたらビジーループを使った例があったが、
CPUを占有するし、ブラウザに怒られるしで駄目だった。


 setTimeout関数を使えば良いってことですね。

100まで0.5秒毎にカウントアップしてinputの中身に表示するサンプル
<head>
<script type="text/javascript">
//<![CDATA[
function func(n){
document.form.input1.value = n++;
setTimeout("func('"+n+"')",500);
}
//]]>
</script>
</head>
<body>
<form name="form">
<table>
<tr><td><input type="text" name="input1"></td></tr>
<tr><td><input type="button" value="スタート" onClick="func(0)"></td></tr>
</table>
</form>
</body>
</html>

 この書き方だと再帰っぽいので、カウントが増えたらスタックエラーになると思ったのだが、
実行回数を増やして試してみると予想に反して10000回でもエラーにならなかった
(IE8、SafariFireFoxで確認)。
但しタイマーはオーバーヘッドが大きいみたいなので正確な間隔で実行するのには向いていなさそう。
また、ボタン2度押し対策はしてないので注意。


 以下のようなコードを書くとIE8(正確には8.0.6001.18876)では1457回でエラーになって止まった。

これが本当の再帰。途中でエラーになる。
function func(n){
document.form.memo1.value = n++;
func(n);
}



ブラウザ毎のスタックの深さについては↓のブログで詳しく調べてあった。
http://d.hatena.ne.jp/nopnop/20080323/1206274563