0 
LoCEngine.prototype.runGame = function() {
    // Initiate our game loop
    ctx.clearRect(0, 0, 800, 600);
    this.drawScene(this.curScene);
    if(this.gameRunning) {
            window.setTimeout(Engine.runGame, 1000 / this.framerate);
    }
}

LoCEngine 是我一直在构建的一个实验性引擎，用于了解 HTML5 Canvas 游戏的来龙去脉。到目前为止一直很开心，直到我进入游戏循环。runGame 会随着时间的推移而被调用，这会清除 Canvas 并调用 drawScene 函数。

LoCEngine 实例存储在变量 Engine 中（不确定在 setTimeout 中使用它是否是最佳实践......请告知）

它会为第一帧正确调用 this.drawScene，但是在超时（30 FPS）时它会抛出一个异常说：

TypeError: this.drawScene is not a function

不太清楚为什么......我敢肯定这只是我没有遇到过的关于 JS 的事情。先感谢您。

4

1 回答 1

1

您需要这样做才能正确调用方法：

LoCEngine.prototype.runGame = function() {
    // Initiate our game loop
    ctx.clearRect(0, 0, 800, 600);
    this.drawScene(this.curScene);
    if(this.gameRunning) {
            window.setTimeout(function() {
                Engine.runGame()
            }, 1000 / this.framerate);
    }
}

当您传递Engine.runGame到 时setTimeout()，它只是传递方法引用本身，而 的对象部分会丢失。因此，当它setTimeout()被. 解决方法是使用我展示的匿名函数自己调用它。thisthis

也可以使用.bind()which 在内部为您做同样的事情。但是，.bind()旧浏览器不支持，所以我倾向于只使用匿名函数。

于 2013-03-14T02:03:08.103 回答