【问题标题】:How do I prevent duplicate guesses in number guessing game?如何防止猜数字游戏中的重复猜测?
【发布时间】:2026-02-16 15:15:01
【问题描述】:

我创建了一个名为尝试收集用户猜到的数字的数组。当用户最终猜出正确的数字时,将尝试次数和猜中的数字告诉用户。我如何避免用户猜测他们已经猜到的数字?我知道每次猜测后我都必须检查数组,看看这个数字是否已经被猜到并且在数组中。 (如果guess 在数组中,显示消息“你已经猜到了,再试一次”)另外,我应该将该猜测添加到猜测数中还是不包括它,因为它是重复猜测?

let num = Math.floor(Math.random() * 20) + 1;

console.log(num);

let num_guess = 0
let tries = []

function do_guess() {
    let guess = Number(document.getElementById("guess").value);

    let message = document.getElementById("message");

    if (isNaN(guess)) {
        message.innerHTML = 'That is not a number!';
    }
    else if (guess > 20) {
        message.innerHTML = 'That number is not in range, try again.';
        num_guess++
        tries.push(guess)
    }
    else if (guess > num) {
        message.innerHTML = "No, try a lower number.";
        num_guess++
        tries.push(guess)
    }
    else if (guess < num) {
        message.innerHTML = "No, try a higher number.";
        num_guess++
        tries.push(guess)
    }
    else if (guess == num) {
        num_guess++
        tries.push(guess)
        message.innerHTML = "You got it! It took you " + num_guess + " tries and your guesses were " + tries + ".";
    }
}

【问题讨论】:

  • 至于是否在猜测次数中包含重复猜测 - 这取决于您以及您希望游戏如何运行。您已将超出范围的值计数为猜测,所以.....

标签: javascript html arrays innerhtml


【解决方案1】:

简单,使用Array.includes

[1, 2, 3].includes(1)
> true
[1, 2, 3].includes(4)
> false

关于是否要包含重复的猜测:由您决定。

【讨论】:

    【解决方案2】:

    您可以使用includes 来检查一个元素是否存在于数组中。

    includes() 方法判断一个数组是否包含某个 其条目之间的值,根据需要返回 true 或 false。

    你需要在所有条件之前添加以下代码

    if (tries.includes(guess)) {
            message.innerHTML = "You guessed that already, try again";
        } 
    

    let num = Math.floor(Math.random() * 20) + 1;
    
    console.log(num);
    
    let num_guess = 0;
    let tries = [];
    const guessContainer = document.getElementById("guess");
    const check = document.getElementById("check");
    let message = document.getElementById("message");
    
    guessContainer.addEventListener("keyup", (e) => {
      message.innerHTML = "";
    });
    
    function do_guess() {
      let guess = Number(guessContainer.value);
      let isCorrect = false;
    
      if (tries.includes(guess)) {
        message.innerHTML = "You guessed that already, try again";
      } else if (isNaN(guess)) {
        message.innerHTML = "That is not a number!";
      } else if (guess > 20) {
        message.innerHTML = "That number is not in range, try again.";
        num_guess++;
        tries.push(guess);
      } else if (guess > num) {
        message.innerHTML = "No, try a lower number.";
        num_guess++;
        tries.push(guess);
      } else if (guess < num) {
        message.innerHTML = "No, try a higher number.";
        num_guess++;
        tries.push(guess);
      } else if (guess == num) {
        isCorrect = true;
        num_guess++;
        tries.push(guess);
        message.innerHTML =
          "You got it! It took you " +
          num_guess +
          " tries and your guesses were " +
          tries +
          ".";
      }
      if (isCorrect) {
        message.classList.add("right");
        message.classList.remove("wrong");
      } else {
        message.classList.add("wrong");
        message.classList.remove("right");
      }
    }
    
    check.addEventListener("click", do_guess);
    body {
      padding: 1rem;
    }
    
    button {
      background-color: indianred;
      color: white;
      border: none;
      padding: .25rem .5rem;
      border-radius: 4px;
      text-transform: uppercase;
    }
    
    .wrong {
      color: tomato;
    }
    
    .right {
      color: green;
    }
    
    h5 {
      margin-top: 1rem;
    }
    <input type="text" id="guess" />
    <button id="check">check</button>
    <h5 id="message"></h5>

    【讨论】:

    • 接受答案,如果它是你所期待的......
    【解决方案3】:

    试试这个:

    var num = Math.floor(Math.random() * 20) + 1;
    
    console.log(num);
    
    var num_guess = 0;
    var tries = [];
    function go_guess() {
    
      let guess = Number(document.getElementById("guess").value);
      
      let message = document.getElementById("message");
      if(tries.includes(guess)){
        message.innerText = "You guessed that already, try again";
      } else {
        
        if (isNaN(guess)) {
          message.innerHTML = 'That is not a number!';
        }
        else if (guess > 20) {
          message.innerHTML = 'That number is not in range, try again.';
          num_guess++;
          tries.push(guess);
        }
        else if (guess > num) {
          message.innerHTML = "No, try a lower number.";
          num_guess++;
          tries.push(guess);
        }
        else if (guess < num) {
          message.innerHTML = "No, try a higher number.";
          num_guess++;
          tries.push(guess);
        }
        else if (guess == num) {
          let _tries = `${tries[0]}`;
          for(let i = 1;i<tries.length;i++){
            _tries += `, ${tries[i]}`;
          }
          num_guess++;
          message.innerText = `You got it! It took you  ${num_guess} tries and your guesses were ${_tries}.`;
        }
      };
    });
    

    【讨论】: