javascript - 在我的第一个 h5 画布游戏上工作，游戏循环有问题（蛇）

Question

所以这就是游戏循环的样子。我只是通过 setInterval() 设置它，它从清除屏幕和绘制 hud 开始。在计算出运动，然后绘制所有内容并检查碰撞（我没有遇到这些问题）之后，我希望一旦玩家输了，他们可以重新开始游戏。

目前它所做的只是调用 window.location.reload() 并返回开始菜单。当玩家撞到墙壁或与自己相撞时，他们就输了。

这是在 checkcollision() 函数中计算的，我尝试了 clearInterval(game); 这几乎行不通。我认为这与 checkcollision() 在游戏循环中有关，并尝试使用一系列返回语句。那没有用，我还尝试将游戏统计数据和功能（分数等）移动到游戏对象中，并尝试通过制作新的游戏对象来重新启动游戏。但所做的只是让它们重叠，即使有相同的参考。

我很困惑，想知道我是否在错误的道路上走得太远了。就像我的意思是它工作正常（在 chome/safari/ff 上，有没有办法让画布与 IE 一起工作？）但我只想获得一个体面的暂停/重启系统。

这是我的代码，但您也可以查看我到目前为止所做的工作并在此处检查完整代码

var game=setInterval(function(){
                ctx.clearRect(0,0,c.width,c.height);
                if(score>localStorage.highscore){localStorage.highscore=score}
                hud();
                snakeMove();
                draw();
                checkCollision();
                },1000/60);