如何解决比较变量时它在 JavaScript 中变为未定义的问题？

Question

我正在制作一个小游戏来测试我的 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。

Answer 1

感谢@Shilly 的评论，我已经找到了自己的问题。

我在错误的时间有一个 drill = tempDrills，导致它的变量 drill 变成了 undefined。通过删除它，我设法让代码正常工作。

Answer 2

问题是这部分代码：

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 的值，除非你足够幸运在启动时滚动到 10 中的 1。所以 tempDrills 是一个在其他 9 种情况下未定义值的局部变量，解释了将 drill 设置回 tempDrills 后的行为。

解决办法就是去掉var关键字，改用全局变量。然后它按我的预期工作。

如何解决比较变量时它在 JavaScript 中变为未定义的问题？

How to fix that when variable is compared it becomes undefined in JavaScript?

html

javascript

nan

undefined

感谢@Shilly 的评论，我已经找到了自己的问题。