みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

JavascriptのtimerIDの意味

いつもお世話になっております。
現在、Javascriptの勉強をしており、その過程でカウントダウンタイマーを作成しています。

テキスト通りにsetTimeout()メソッドなどを使用しているのですが、timerIDの意味が理解できず困っております。

タイマーを識別するID番号ということはなんとなく理解できるのですが、下記コードのelse if (timerID)やtimerID=0とは何を意味しているのでしょうか。

if文の条件がtimerIDとはどういうことなのか。
timerIDの値を0にする必要性は何なのか。

教えてください。

<doctype! html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Javascript</title>
<script type="text/javascript">
window.onload = init;

function init(){
document.form1.start.onclick = start;
document.form1.reset.onclick = stop;
}

var timerID;
function start(){
count = parseInt(document.form1.time.value);
if (count<=0){
count = 0;
return;
} else if (timerID){
count--;
}
document.form1.time.value=count;

if (count==0){
clearTimeout(timerID);
timerID = 0;
alert("時間です");
return;
}
timerID = setTimeout("start()", 1000);
}

function stop(){
document.form1.time.value=0;
if(timerID){
clearTimeout(timerID);
timerID=0;
}
}

</script>
</head>
<body>
<h1>カウントダウンタイマー</h1>
<form name="form1">
時間<input name="time" type="text" size="3">秒<br>
<input name="start" type="button" value="スタート">
<input name="reset" type="button" value="リセット">
</form>
<script type="text/javascript">
</script>
</body>
</html>

投稿日時 - 2013-08-26 07:03:58

QNo.8236098

困ってます

質問者が選んだベストアンサー

>タイマーを識別するID番号ということはなんとなく理解できるのです

この手の問題は、経験をつめば、簡単に理解できるようになります。よく学校とかだとロジックを学びますが、ペットボトルをロケットにするなんて事は学校では教えてくれません。

ポイントは

>clearTimeout(timerID);

ですね。質問者が書いていますが「タイマーを識別するID番号」ですよね。”番号”てことです、setTimeout の戻り値で整数ですね。起動が成功すると、0より大きい整数がセットされるわけです。これはECMAのリファレンスで、成功した場合は、何の値がもどり、失敗した場合は何がもどり、その他のエラーは何が戻るか、確認してください。

http://www.google.co.jp/search?hl=ja&q=ECMA+%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9&lr=lang_ja#fp=b998e3b4af03b4ad&hl=ja&lr=lang_ja&psj=1&q=+ECMAScript%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9%E3%80%80%E3%80%80setTimeout&tbs=lr:lang_1ja

関数は、必ず、そうやって、その3パターンを考慮して戻り値を用意しておくものです。自作の関数も、そのように用意しましょう。今回の場合、その戻り値を使って、clearTimeoutに渡して、止める。では、setTimeoutが何らかの要因で動作しなかった場合は、関数の仕様にしたがえばいいが、ユーザーが途中で止めた場合、ユーザー操作によるキャンセルを、どうやって、記録にのこしておけばいいいのだろう。

と、考えると、何か変数を別によういして 例えば statusID に true をセットするとかすればいいが、そんなことしなくても、timerID に違う意味をもたせれば、いいこに経験をつめば容易に気がつく物です。そう、”初期化”(initialisation) よく init なんて感じで略している事が多いですね。

つまり、
>function stop(){

などを見ると、

>if(timerID){

で評価しています、true(1) or false(0) ですね。データ型をJavaScript のやり方にしたがってあわせたってことです。このようなあいまいさを、CSSなどのハック(クロスブラウザ)で利用しています。

他にもいっぱい、いいやり方があるので、そっちを見つけたら、そっちに変えて完成させた方がいいレベルの物です。

投稿日時 - 2013-08-26 10:13:12

お礼

非常に詳しく解説して頂き、ありがとうございます。

関数の扱い方など、プログラミングを行う上での考え方の面でもとても為になりました。

投稿日時 - 2013-08-27 07:08:21

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問