为什么clearInterval（...）似乎没有在这里完成它的工作？

Question

Repro步骤：

• 转到http://playclassicsnake.com/Play
• 点击＆＃34;快速＆＃34; （或＆＃34;慢＆＃34;或甚至＆＃34;中＆＃34;）＆＃34;设定速度＆＃34;在＆＃34;控制＆＃34;
• 按左箭头键，等到蛇击中左墙并且＃34; Game Over！＆＃34;
• 查看JavaScript控制台
• 查看类似
的内容

  

未捕获的TypeError：无法读取属性＆＃39; 0＆＃39;未定义的

• 刷新页面
• 按左箭头键，等到蛇击中左墙并且＃34; Game Over！＆＃34;
• 在控制台中看不到与之前相同的错误

我的调查：

错误的原因是第一种情况下的函数move在＆＃34; Game Over！＆＃34;之后被调用。而在第二种情况下是不是。第二种情况是正确的行为。在这两种情况下，函数endGame都像

一样开始

this.endGame = function ( msg )
{
    this.inProgress = false;
    clearInterval(this.mover);

正在调用

，但由于某种原因，在第一种情况下间隔未能清除。这没有任何意义，因为第一种情况和第二种情况之间的唯一区别是，在第二种情况下，速度设置为

SG.setSpeed($('#speed-form input[type="radio"]:checked').val());

在页面加载时启动游戏，在第一种情况下，使用该设置进行设置，然后使用

进行更新

$('#speed-form input[type="radio"]').click(function ( )
{
    SG.setSpeed($(this).val());
});

单击其中一个单选按钮时。我用

进行了测试

this.endGame = function ( msg )
{
    console.log(this.mover); // TEST
    this.inProgress = false;
    clearInterval(this.mover);

在两种情况下都定义了this.mover。由于我不理解并且可能与我的问题有关的原因，在第一种情况下，间隔的ID总是一个很高的数字，如68，74等，而在第二种情况下，它总是2！

我不知道这里发生了什么。任何帮助是极大的赞赏。

完整代码here。

Answer 1

问题在于，当您拨打clearInterval(this.mover);时，您只清除了设置为this.mover的最后间隔，以及所有间隔它没有受到影响。我提出的解决方案（似乎有效）是每次设置一个新的时候清除前一个时间间隔。这样可以解决这个问题，因为在任何给定时刻最多只有一个间隔。