《Javascriptのif文が反応しない》

《Javascriptのif文が反応しない》
Javascript初心者です。Javascriptのif文で下記のような文言を出したいと思うのですが、「同じ値」のメッセージが出てくれません。詳しい方、ご教授願います。

rand1:●（※02までのランダムな数字）
rand2:●（※02までのランダムな数字）
「rand1の方が大きい」「rand2の方が大きい」「同じ値」のいずれかがメッセージとして出る

以下、ソースコードです。

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4   <meta charset="UTF-8">
5   <title>if</title>
6</head>
7<body>
8<script>
9   var rand1=Math.floor(Math.random()*3)
10   var rand2=Math.floor(Math.random()*3)
11   document.write("<p>rand1:"+rand1+"</p>");
12   document.write("<p>rand2:"+rand2+"</p>");
13   
14   if(rand1>=rand2){
15       document.write("rand1の方が大きい値です");
16   }
17   else if(rand1<=rand2){
18       document.write("rand2の方が大きい値です");
19   }
20   else if(rand1===rand2){
21       document.write("2つは同じ値です");
22   }
23</script>
24</body>
25</html>
26

行動規範の内容に同意します

回答5件

ベストアンサー

if(rand1>=rand2)となっていますので、等しい場合もこの条件に合致してしまいます。rand1 > rand2として等しい場合を除外しましょう（あとのrand1<=rand2も同じ）。

投稿2019/05/28 02:50

maisumakun

総合スコア146583

maisumakun

2019/05/28 02:52

本題ではありませんが、document.writeはかなり古い書き方です。何かのテキストに沿って進めているのであれば、もっと新しい書き方のものを参考にしたほうがいいでしょう。

退会済みユーザー

2019/05/28 03:15

回答ありがとうございました。+aのご指摘もくださったのでベストアンサーにさせていただきます。

退会済みユーザー

2019/05/28 03:30

初歩的な質問で申し訳ありませんが、document.writeの代わりはconsole.logですか？調べると innerHTMLというのも出てきて違いがよくわかりません…。

maisumakun

2019/05/28 03:51

console.logはデバッグ出力用の関数です。 HTMLに書き出したい場合は、textContentやinsertBeforeといったDOMを使う、あるいはjQueryなどライブラリを使う形がいいでしょう（innerHTMLは、HTMLを出力する形になるので、不用意にHTMLが書き換えられるリスクがあり、使用には注意が必要です）。

退会済みユーザー

2019/05/28 04:02

ありがとうございます。初心者すぎて仰っている内容がまだあまり理解できておりませんが、調べて少しずつものにしたいと思います。

行動規範の内容に同意します

条件式が以上(>=)と以下(<=)なので
if(rand1>=rand2){はrand1とrand2が
同じ数値でも条件に一致してしまいます。

以下のようにより大きい(>)と未満(<)にすれば正しく動作します。

javascript
1var rand1 = Math.floor(Math.random() * 3);
2var rand2 = Math.floor(Math.random() * 3);
3document.write("<p>rand1:" + rand1 + "</p>");
4document.write("<p>rand2:" + rand2 + "</p>");
5
6if (rand1 > rand2) {
7  document.write("rand1の方が大きい値です");
8} else if (rand1 < rand2) {
9  document.write("rand2の方が大きい値です");
10} else {
11  document.write("2つは同じ値です");
12}

投稿2019/05/28 02:56

yasutomi

総合スコア2941

退会済みユーザー

2019/05/28 03:16

回答ありがとうございました。参考にさせていただきます。

行動規範の内容に同意します

条件式が以上・以下になっているから、最後のelse ifは絶対に通らないからです。
つまり、以上（>=）と以下（<=）は、等価（==）も含みの条件式だからです。
正しくは下記です。

javascript
1var rand1=Math.floor(Math.random()*3)
2var rand2=Math.floor(Math.random()*3)
3document.write("<p>rand1:"+rand1+"</p>");
4document.write("<p>rand2:"+rand2+"</p>");
5
6if(rand1>rand2){
7  document.write("rand1の方が大きい値です");
8}else if(rand1<rand2){
9  document.write("rand2の方が大きい値です");
10}else if(rand1===rand2){
11  document.write("2つは同じ値です");
12}