 2.乱数を使いこなせ |
<html><head>
<script language="JavaScript">
var count=0;
var atari=Math.floor(Math.random()*3+1);
function clickhere(n){
count++;
if(count==1){
if(n==atari) alert("あたり");
else alert("はずれ");
}
else{
alert("２回もクリックしちゃ、ダメダメ！");
}
}
</script></head>
<body>
宝探しゲーム！ どこか好きなところを１回だけクリックしてね。<br>
<a href="JavaScript:clickhere(1);">その１</a><br>
<a href="JavaScript:clickhere(2);">その２</a><br>
<a href="JavaScript:clickhere(3);">その３</a><br>
</body></html> |
赤字の部分が前の例と違う部分です。ここで、新しい関数が２つ出てきているので、それについて説明します。
Math.floor() は、()内の数を超えない整数値を返します。小数点以下切り捨てのようなことをしたい場合は便利です。例えば、Math.floor(5.5) なら５、Math.floor(-5.5) なら−６を返します。ちなみに、「返す」というのは、その結果がMath.floor()に代入されるといった感じのことです。例えば、a=3+Math.floor(1.1) の場合、Math.floor(1.1)は１を返すので、a=3+1 になり、結果として a=4 となります。
Math.random() がここの章で重要な、乱数を返す関数です。Math.random() が返す範囲は０以上１未満の小数です（１を返すことはありません）。それ以外の乱数がほしい場合は、Math.random()にかけ算や足し算をして調整します。
| 書式 | 返す値 |
|---|---|
| Math.random() | ０以上１未満の小数 |
| Math.random()*3 | ０以上３未満の小数 |
| Math.random()*3+1 | １以上４未満の小数 |
| Math.floor(Math.random()*3+1) | １以上３以下の整数（４は含まれない！） |
上のプログラムでは、atari は１以上３以下の整数を返すことになります。clickhere(n)のn の中身は、１，２，３のうちのどれかしか当てはまらないので、必ず当たりが含まれることになります。*1
*1 Math.floor(Math.random()*4+1)とすると、当たりが出ない場合が起こります。試してみましょう。
<html><head>
<script language="JavaScript">
var aite;
var message;
function clickhere(n){
aite=Math.floor(Math.random()*3+1);
if(n==1) message="あなた：グー\n";
if(n==2) message="あなた：チョキ\n";
if(n==3) message="あなた：パー\n";
if(aite==1) message+="相手：グー";
if(aite==2) message+="相手：チョキ";
if(aite==3) message+="相手：パー";
alert(message);
}
</script></head>
<body>
じゃんけん大会！ 好きなところをクリックしてね。<br>
<a href="JavaScript:clickhere(1);">グー</a><br>
<a href="JavaScript:clickhere(2);">チョキ</a><br>
<a href="JavaScript:clickhere(3);">パー</a><br>
</body></html> |
３つのうち１つをクリックするのは、今までと同じですが、関数 clickhere() の中身が違っています。まず、変数 aite に１〜３の乱数が入ります。これが相手の手になります。そして、変数 message*2には alert で表示する文章が入ります。なお、message 内に入っている \n は alert 内の改行をするために入れています。
*2 message+="相手：グー" は、message=message+"相手：グー" と同じ意味です。
さて、２人の出した手を見て、どちらが勝っているかを判定するには、どうしたらよいでしょうか。まず、あいこは if(n==aite) で判定すればいいので簡単ですね。
「あなたの勝ち」の判定は「n==1 かつ aite==2」「n==2 かつ aite==3」「n==3 かつ aite==1」の３通りです。最初の２つは if(n+1==aite) で大丈夫そうですが、３つ目の判定が問題です。
この問題を解決するために、剰余（じょうよ）というのを使います。簡単に言うと、わり算のあまりを求めるものです。
| 書式 | 結果 |
|---|---|
| 1 % 3 | 1 / 3 = 0 あまり 1 なので、１ |
| 2 % 3 | 2 / 3 = 0 あまり 2 なので、２ |
| 3 % 3 | 3 / 3 = 1 あまり 0 なので、０ |
| 4 % 3 | 4 / 3 = 1 あまり 1 なので、１ |
| 5 % 3 | 5 / 3 = 1 あまり 2 なので、２ |
<html><head>
<script language="JavaScript">
var aite;
var message;
function clickhere(n){
aite=Math.floor(Math.random()*3+1);
if(n==1) message="あなた：グー\n";
if(n==2) message="あなた：チョキ\n";
if(n==3) message="あなた：パー\n";
if(aite==1) message+="相手：グー\n";
if(aite==2) message+="相手：チョキ\n";
if(aite==3) message+="相手：パー\n";
if(n==aite) message+="あいこです";
else {
if((n+1)%3==aite%3) message+="あなたの勝ち";
else message+="相手の勝ち";
}
alert(message);
}
</script></head>
<body>
じゃんけん大会！ 好きなところをクリックしてね。<br>
<a href="JavaScript:clickhere(1);">グー</a><br>
<a href="JavaScript:clickhere(2);">チョキ</a><br>
<a href="JavaScript:clickhere(3);">パー</a><br>
</body></html> |