@demilioposted at 2022-09-13

計算結果が一致しない原因

Q&A

JavaScript

解決したいこと

計算結果を一致させ、ブラウザに「正解」と出したい。

計算結果が一致しなくてさまよっています。（計算が合ってても正解とでない、ハズレとでる）
constは再代入不可でletは再代入可能とありましたが、
そこら辺の記述が間違っているのでしょうか。

初歩的なことで申し訳ありませんが、よろしくお願いいたします。

該当するソースコード

<h2>計算</h2>
    <p>問題<span id="cal"></span>=<input id="01" value="">
        <button onclick="check()">GO</button>
    </p>
    <p id="result"></p>
    <p></p>


    <script>
        // 問題
        const today = new Date();
        const q1 = today.getMilliseconds();
        const q2 = today.getSeconds();
        let answer = `${q1}+${q2}`;
        const collect = q1 + q2;
        document.getElementById("cal").innerHTML = answer;

        
        function check() {
            document.getElementById("01").value = collect;
        if(answer == collect) {
            document.getElementById("result").textContent = "正解";
        }
        else {
            document.getElementById("result").textContent = "ハズレ";
        }
        }

1Answer

@shiracamus posted at 2022-09-13

それぞれの変数の値がどうなっているのか、console.log出力してみるといいですよ。
answer には ${q1}+${q2} で変数展開した 912+35 といった文字列が入っていて correct には数値加算した 947 といった数値が入っているので、answer == correct で比較しても一致しないでしょう。

修正案

      // 問題
      const today = new Date();
      const q1 = today.getMilliseconds();
      const q2 = today.getSeconds();
      const correct = q1 + q2;         // 正解 (数値)
      const question = `${q1}+${q2}`;  // 質問文（文字列）
      document.getElementById("cal").innerHTML = question;

      function check() {
        const answer = document.getElementById("01").value;  // 回答値
        if(answer == correct) {
          document.getElementById("result").textContent = "正解";
        }
        else {
          document.getElementById("result").textContent = "ハズレ";
        }
      }

1Like

Comments

@demilio
Questioner
そうなのですね。
console.logも使用して、中身を理解できました。
大変ありがとうございます。

Are you sure you want to delete the question?