Question

我正在使用HTML5，CSS3和JavaScript为课堂写一个Whack-A-Mole游戏。我遇到了一个非常有趣的错误，在看似随机的间隔，我的鼹鼠停止改变他们的“onBoard”变量，结果，将停止分配给董事会。这些洞也发生了类似的事情，但在我的测试中并不常见。所有这些都完全独立于用户交互。

在我废弃项目并从头开始之前，你们和gals是我最后的绝望。这让我感到沮丧。如果您愿意拥有图像，则可以是Codepen和我的github。

由于Codepen链接显然需要附带代码，因此我认为问题出现的功能就在这里。

// Run the game
    function run() {
        var interval = (Math.floor(Math.random() * 7) * 1000);

        if(firstRound) {
            renderHole(mole(), hole(), lifeSpan());
            firstRound = false;
        }

        setTimeout(function() {
            renderHole(mole(), hole(), lifeSpan());
            run();
        }, interval);
    }

我认为发生的事情就是这样。该函数以0-6秒之间的随机间隔运行。如果函数运行得太快，传递给我的renderHole（）函数的数据将被新数据覆盖，从而导致前一个洞和鼹鼠永远不会从板上取下（至少可变。）

编辑：事实证明我的问题来自于我没有返回我的递归函数调用。来自不同的语言，我不知道，在JavaScript中，如果没有其他任何指示，函数将返回“未定义”。然而，我将GameAlchemist的答案标记为正确答案，因为我的原始代码令人费解和混乱，并且在某些地方也是多余的。谢谢大家的帮助！

Answer 1

你在代码中已经完成了一些设计错误，这些错误一个接一个地使代码难以阅读和跟踪，而且很难调试。
mole()函数可能会返回一个痣...或者没有......或者创建一个超时以便稍后调用自己...当mole再次调用自己时，将对结果做什么？什么都没有，所以它只会被标记为onBoard永远不会被再次看到 ---＆GT;＆GT;＆GT;对mole()有明确的定义和单一责任：例如'返回可用的非显示的痣字符或null'。这就是全部，没有计数，没有对象的标记，只是KISS（保持简单S ......）：它应该总是返回一个值并且永远不会触发超时。
hole()也是如此：返回一个空洞或空，没有标记，没有超时设置。

render应该简化：得到一个痣，得到一个洞，如果再见不到任何一个。如果找到了一个mole + hole，只需设置新的mole / hole couple +事件处理程序（在一个单独的函数中）。您的主run函数将确保一次又一次地尝试生成痣。

Whack-A-Mole游戏中有巨大的bug！我可以帮忙解决这个问题吗？

1 个答案: