javascript - 如何解决比较变量时JavaScript中 undefined variable 的问题？

我正在创建一个小游戏来测试我的JavaScript技能。由于某些原因，我无法弄清楚，当我比较变量iron和变量drill时，drill变得不确定，并在我的网页中列为NaN。

我在repl.it上使用Javascript和HTML。我觉得这可能与我的If语句有关，但是如果这是问题的根源，我不确定如何解决它们。同样，变量iron和drill设置为默认值0。

  if (iron < drillPrice) {
    alert("Not enough iron");
  }
  if (iron >= drillPrice) {
    drill = drill + 1;
    tempDrills = drill
    iron = iron - drillPrice;
    document.getElementById('drillsOwned').innerHTML = drill;
    iron = Math.round(iron * 10) / 10;
    document.getElementById('ironOwned').innerHTML = iron;
    drillPrice = Math.floor(100 * Math.pow(1.1, drill));
    document.getElementById("drillPrice").innerHTML = drillPrice;
  }
}

完整的摘录在这里：https://repl.it/@Munix/factory

如果变量iron大于变量drillPrice，则期望的输出，应将drill增大一个，在这种情况下，应使drill等于1。实际发生的是drill变为undefined。如果变量iron小于drillPrice，则应显示测试Not enough iron，而不要触摸变量drill。实际发生的是显示测试Not enough iron，但将drill设置为undefined。

最佳答案

问题是代码的这一部分：

function randomEvent() {
  var event = Math.random();
  event = Math.round(event * 10);
  if (event <= 9) {
    document.getElementById("event").innerHTML = "No event today!";
    drill = tempDrills
  }
  if (event == 10) {
    var eventFlavor = 'You have iron deficiency! 1/2 iron from drills for the rest of the day!';
    document.getElementById("event").innerHTML = eventFlavor;
    var tempDrills = drill;
    drill = drill / 2;
  }
}

我们在这里看到的是一个如何在javascript中创建变量的示例：
var tempDrills = drill;
变量的声明被提升到函数的顶部，因此基本上看起来像这样：

function randomEvent() {
  var event = Math.random();
  var tempDrills;
  ...
}

因此，该变量将被提升，并且不会将其设置为drill的值，除非您有幸在启动时将十分之一的值滚动。因此，tempDrills是其他9种情况下未定义值的局部变量，解释了将drill设置回tempDrills后的行为。

解决方案很简单，就是删除var关键字，所以您改用全局变量。然后，它按我的预期工作。

关于javascript - 如何解决比较变量时JavaScript中 undefined variable 的问题？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/57660656/