
ミミウサ
JavaScript 初心者ですが、勉強中です。
setTimeout()コマンドというのがありますが、
なんで”out”なんですか?
ひとつ簡単なサンプルを作ってみたら、setTimeout()コマンドの動きが理解できました。
ボタンを押して2秒後にアラートを表示するJavaScriptの例を使って、setTimeout()コマンドの使い方を学んでみましょう。
JavaScriptサンプル「2秒後にアラートを表示する」
setTimeout()コマンドを学ぶために作成するサンプルは、完成すると次のように動作します。
ボタンを押して2秒後に「ご飯ですよ」のアラートボックスが表示されるものです。
ちょっとしたタイマーです。
このソースコードは以下に掲載しています。
setTimeout()コマンドとは
setTimeout(処理内容, 時間)
で、指定時間後に一度だけ処理を実行します。
時間は処理を実行するまでの時間で、ミリ秒(例:1秒=1000ミリ秒)単位で指定します。
setTimeoutは「設定(set)した時間(time)が過ぎたとき(out)の処理内容」というように考えると理解しやすいですね。
”out”は設定した時間(setTime)から外れた時の”out”なのですね!
サンプル「2秒後にアラートを表示する」のソースコード
ソースコードと解説は以下のとおりです。
<!DOCTYPE html> <html> <head> <title>Timer</title> <script type="text/javascript"> function execute(){ alert ("It's time for lunch! ご飯ですよ"); //指定時間後の実行内容。ここではAlertを表示。 } function exec_timeout(){ setTimeout("execute();", 2000); //2000ミリ秒=2秒後に、execute()のfunctionを実行する。 } </script> </head> <body> <h1>Timer</h1> <form action="#"> <input type="button" value="Press this button 押して" onclick="exec_timeout();" > //このボタンがclickされたらexec_timeout()を実行する。 </form> </body> </html>
まとめ
setTimeout()コマンドの使い方を学べる、ボタンを押して2秒後にアラートを表示するJavaScriptのサンプルとコードをご紹介してきました。
簡単な作例を作っていくのが一番、コマンドを理解するのに役立ちそうです。