ここでは、初心者から実践的に学べるプログラミングスクール「ウェブカツ!!」のJavaScript・jQuery部入門を受講している生徒の方向けに、さらに理解度を上げるための特訓をしていきます。
出題の回答は全て「JavaScript言語」を使って回答してください。
回答のJavaScript言語は「ES5」で答えてください。
（ES5がよく分からない人は「JavaScript・jQuery部入門どおりの書き方」ってことです。）
開発環境はMacとGoogleChromeブラウザを使います。
Windowsの人もGoogleChromeブラウザを使いましょう。
鬼練８：無限の愛を持つ男編part2
鬼練６でやったやつをちょっと改良しましょう。
仕様書
下記要件に従ってプログラムを組んでみてください。
画面に
「愛してるよ。」を0.1秒ごとに１回表示させる。
10秒後に
１行改行して
「彼女：ひぃやぁぁぁーーーーーー！！」
「自分：たわばっ！」
と表示させる。
恋愛も営業も「暑苦しさ」「圧」を感じさせない人の方が上手くいくんですよね。（経験談）
ヒント
１０秒後に「setIntervalを止める」と言う処理とセリフを表示する処理をしなければいけませんね。
「◯秒後に指定の処理を行う」
ということをどう実現できるのか？ですね。
それには
|
1 |
setTimeout() |
というjsで用意されている関数が使えます。
使い方は
|
1 |
setTimeout(実行したい処理の関数名, 何秒後に実行するかをミリ秒で指定) |
です。
答え
|
1 2 3 4 5 6 7 8 9 10 |
var intervalId = setInterval(function(){ document.write('愛してるよ。'); }, 100); setTimeout(function(){ clearInterval(intervalId); document.write('<br>'); document.write('彼女：ひぃやぁぁぁーーーーーー！！<br>'); document.write('自分：たわばっ！'); }, 10000); |
答えはこうなります。
以前やったリファクタを少し取り入れた書き方をしています。
「彼女」や「自分」など役者やセリフを定数にすることは今回してませんが、もう１回自分でやってみてね。
setInterval()を止めるには、まずsetInterval()を実行するのと同時に変数に格納してあげる必要があります。
そうするとそのIDが変数の中に入ります。
だって、setInterval()を何個も作った場合、「どれを止めればいいのか？」分かるようにIDとか名前的な何かが必要ですよね？？
なので、IDが返却されるようになっています。
そのIDを
|
1 |
clearInterval(setIntervalのID); |
で指定してやれば、止まります。
あとは、今まで通り。
ですね。
つづく。。
