如何比较数字大小？及修复JS猜数字游戏的数值判断分支

1. 如何比较一个数是否大于另一个数 #

在JavaScript中，直接使用大于运算符 > 就能判断一个数是否大于另一个数，语法示例如下：

let num1 = 25;
let num2 = 18;

if (num1 > num2) {
  console.log("num1 大于 num2");
}

当左侧数值严格大于右侧时，条件返回true，会执行代码块内的逻辑。如果需要判断大于等于的情况，可改用 >= 运算符。

2. 修复猜数字游戏的分支失效问题 #

你的else if(guess >= 21)分支不生效，核心原因是前面的条件分支已经覆盖了所有大于目标数的场景——比如目标数是12，当你猜25时，会先触发“猜大了”的分支，根本轮不到最后一个判断。

解决方法很简单：把判断数值是否超过20的逻辑放到所有分支最前面，确保输入值大于20时优先触发该分支，不会被后续判断拦截。

修改后的完整代码示例：

HTML部分 #

<div>
  <input type="number" id="guessInput" placeholder="输入1-20的数字">
  <button onclick="checkGuess()">提交猜测</button>
  <p id="result"></p>
</div>

JavaScript部分 #

// 生成1-20的随机目标数
const targetNumber = Math.floor(Math.random() * 20) + 1;

function checkGuess() {
  const guess = parseInt(document.getElementById("guessInput").value);
  const resultElement = document.getElementById("result");

  // 优先判断是否超出范围
  if (guess > 20) {
    resultElement.textContent = 'Your number is higher than 20. Try again!';
  } else if (guess < 1) {
    resultElement.textContent = 'Your number is lower than 1. Try again!';
  } else if (guess > targetNumber) {
    resultElement.textContent = 'Too high! Try again.';
  } else if (guess < targetNumber) {
    resultElement.textContent = 'Too low! Try again.';
  } else {
    resultElement.textContent = 'Congratulations! You got it right!';
  }
}

调整后，只要输入的数大于20，就会正确显示你需要的提示文本，不会被其他分支干扰。

内容的提问来源于stack exchange，提问作者ertebest