4数字猜测游戏，语法或逻辑问题？

Question

我是JavaScript的新手，我试图创建一个游戏，您可以猜测随机生成的4个数字的组合。您可以输入4位数字，并根据您的输入显示一些符号：

• × - 如果您猜到了组合中的数字，而不是正确的索引。
• ¤ - 如果您猜到组合中的数字及其索引也是如此。

但是这些符号并没有显示出我想要的方式。 （例如，随机生成的数字为："3,3,0,3"。当您输入"3,3,0,3"时，输出应为¤¤¤¤，但由于某种原因，它是¤×¤×）。

在代码中，x1，x2，x3和x4是随机生成的数字所在的变量。 xy1，xy2，xy3和xy4是您的输入所在的变量。后来对这些进行了比较。

现在，语法或逻辑是否有缺陷？

function getRandomInt(max) {
  return Math.floor(Math.random() * Math.floor(max));
}

var x1 = (getRandomInt(6));
var x2 = (getRandomInt(6));
var x3 = (getRandomInt(6));
var x4 = (getRandomInt(6));

/// The generated nuber a player needs to guess will show up in console.For testing purposes.
console.log("The generated digits:" + x1 + "," + x2 + "," + x3 + "," + x4);

document.body.innerHTML = ("This program generates 4 random digits (from 0 to 5). The point of this game is to guess what are those 4 digits.");
document.body.innerHTML += ("Symbols:<br> This symbol will show if you guessed a number, but not its index: × <br> This symbol will show if you guessed a number and its index: ¤. <br>If you didn't guess a number right, no symbol will show up.<br>You can press the button 'guess a number' to try again.<br>");

function try1() {
  let xy1 = prompt("Enter first number:");
  if (xy1 == x1) {
    document.body.innerHTML += (" ¤ ");
  } else if (xy1 == x2) {
    document.body.innerHTML += (" × ");
  } else if (xy1 == x3) {
    document.body.innerHTML += (" × ");
  } else if (xy1 == x4) {
    document.body.innerHTML += (" × ");
  } else {
    document.body.innerHTML += (" ");
  }

  let xy2 = prompt("Enter second number:");
  if (xy2 == x1) {
    document.body.innerHTML += (" × ");
  } else if (xy2 == x2) {
    document.body.innerHTML += (" ¤ ");
  } else if (xy2 == x3) {
    document.body.innerHTML += (" × ");
  } else if (xy2 == x4) {
    document.body.innerHTML += (" × ");
  } else {
    document.body.innerHTML += (" ");
  }

  let xy3 = prompt("Enter third number:");
  if (xy3 == x1) {
    document.body.innerHTML += (" × ");
  } else if (xy3 == x2) {
    document.body.innerHTML += (" × ");
  } else if (xy3 == x3) {
    document.body.innerHTML += (" ¤ ");
  } else if (xy3 == x4) {
    document.body.innerHTML += (" × ");
  } else {
    document.body.innerHTML += (" ");
  }

  let xy4 = prompt("Enter fourth number:");
  if (xy4 == x1) {
    document.body.innerHTML += (" × ");
  } else if (xy4 == x2) {
    document.body.innerHTML += (" × ");
  } else if (xy4 == x3) {
    document.body.innerHTML += (" × ");
  } else if (xy4 == x4) {
    document.body.innerHTML += (" ¤ ");
  } else {
    document.body.innerHTML += (" ");
  }

  document.body.innerHTML += ("<br>Your guess:" + xy1 + "," + xy2 + "," + xy3 + "," + xy4 + "<br>");
}

function show() {
  document.body.innerHTML += ("<br>Number generated:" + x1 + "," + x2 + "," + x3 + "," + x4);
}

try1();

Answer 1

对我来说似乎是一个逻辑错误，但只有在输入中有重复数字时才会出现错误（例如3303，由于三倍的3）。所以这部分代码：

let xy2 = prompt("Enter second number:");
if (xy2 == x1) {
    document.body.innerHTML += (" × ");
} else if (xy2 == x2) {
    document.body.innerHTML += (" ¤ ");
} else if (xy2 == x3) {
    document.body.innerHTML += (" × ");
} else if (xy2 == x4) {
    document.body.innerHTML += (" × ");
} else {
    document.body.innerHTML += (" ");
}

造成了这个问题。这是因为在第一个条件发生后，它没有继续检查其余的条件。 EG，当数字和答案都是3303时，我们将进入第一个分支，因为3（我们的第二个输入数字）等于3（我们的第一个生成数字），这意味着我们写了×

解决方案是要意识到如果可能的话我们应该总是尝试编写¤，这意味着必须是我们检查的第一个条件。因此，如果您重新排序if语句，以便¤始终是第一个分支，那么应该修复它。请参阅以下代码段：

＆＃13;

＆＃13;

function getRandomInt(max) {
  return Math.floor(Math.random() * Math.floor(max));
}

// For testing, setting manually to 3303
var x1 = 3 // (getRandomInt(6));
var x2 = 3 // (getRandomInt(6));
var x3 = 0 // (getRandomInt(6));
var x4 = 3 // (getRandomInt(6));

/// The generated nuber a player needs to guess will show up in console.For testing purposes.
console.log("The generated digits:" + x1 + "," + x2 + "," + x3 + "," + x4);

document.body.innerHTML = ("This program generates 4 random digits (from 0 to 5). The point of this game is to guess what are those 4 digits.");
document.body.innerHTML += ("Symbols:<br> This symbol will show if you guessed a number, but not its index: × <br> This symbol will show if you guessed a number and its index: ¤. <br>If you didn't guess a number right, no symbol will show up.<br>You can press the button 'guess a number' to try again.<br>");

function try1() {
  // Already in the correct order
  let xy1 = prompt("Enter first number:");
  if (xy1 == x1) {
    document.body.innerHTML += (" ¤ ");
  } else if (xy1 == x2) {
    document.body.innerHTML += (" × ");
  } else if (xy1 == x3) {
    document.body.innerHTML += (" × ");
  } else if (xy1 == x4) {
    document.body.innerHTML += (" × ");
  } else {
    document.body.innerHTML += (" ");
  }

  // Note that the xy2 == x2 is moved to the first condition
  let xy2 = prompt("Enter second number:");
  if (xy2 == x2) {
    document.body.innerHTML += (" ¤ ");
  } else if (xy2 == x1) {
    document.body.innerHTML += (" × ");
  } else if (xy2 == x3) {
    document.body.innerHTML += (" × ");
  } else if (xy2 == x4) {
    document.body.innerHTML += (" × ");
  } else {
    document.body.innerHTML += (" ");
  }

  // Again note the reorder:
  let xy3 = prompt("Enter third number:");
  if (xy3 == x3) {
    document.body.innerHTML += (" ¤ ");
  } else if (xy3 == x1) {
    document.body.innerHTML += (" × ");
  } else if (xy3 == x2) {
    document.body.innerHTML += (" × ");
  } else if (xy3 == x4) {
    document.body.innerHTML += (" × ");
  } else {
    document.body.innerHTML += (" ");
  }

  // And once more:
  let xy4 = prompt("Enter fourth number:");
  if (xy4 == x4) {
    document.body.innerHTML += (" ¤ ");
  } else if (xy4 == x1) {
    document.body.innerHTML += (" × ");
  } else if (xy4 == x2) {
    document.body.innerHTML += (" × ");
  } else if (xy4 == x3) {
    document.body.innerHTML += (" × ");
  } else {
    document.body.innerHTML += (" ");
  }

  document.body.innerHTML += ("<br>Your guess:" + xy1 + "," + xy2 + "," + xy3 + "," + xy4 + "<br>");
}

function show() {
  document.body.innerHTML += ("<br>Number generated:" + x1 + "," + x2 + "," + x3 + "," + x4);
}

try1();

＆＃13;

＆＃13;

＆＃13;