打字稿:私人成员突然未定义

时间:2013-06-17 13:14:44

标签: javascript this typescript setinterval private-members

所以,我有一个基本的Typescript应用程序,实际上不应该导致任何重大问题,但看起来,这里出了问题我不知道是什么。

我的minUpdateRate类中有这个私有成员GameContainer,它在构造函数中初始化。这看起来很顺利,因为调用GameContainer.start()时,console.log()方法会打印出1

但是,当调用GameContainer.render()方法时,它似乎超出范围或其他内容,日志方法会在那里输出undefined

我对TypeScript很陌生,而不是那么深入JavaScript(特别是当涉及到范围时,它让我感到困惑:/)。我怎么能解决这个问题?

主要课程:

class TwoDGame extends Game {
    public static main(context:CanvasRenderingContext2D) {
        var game:Game = new TwoDGame();
        var container:GameContainer = new GameContainer(context, game);

        container.start();

        return game;
    }
}

Game Container类:

class GameContainer {
    ...
    private minUpdateRate:number;
    private game:Game;
    private time:number;
    ...

    constructor(context:CanvasRenderingContext2D, game:Game) {
        ...
        this.minUpdateRate = 1;
        this.game = game;
    }

    public start() {
        ...
        console.log(this.minUpdateRate);
    }

    public render() {
        var now:number = new Date().getMilliseconds();
        var delta:number = now - this.time;
        console.log(this.minUpdateRate);

        if (delta > this.minUpdateRate) {
            ...
        }
    }
}

通过脚本区域中的setInterval调用Render:

var game = TwoDGame.main(context);

setInterval(game.getGameContainer().render, 16);

1 个答案:

答案 0 :(得分:5)

当您以这种方式传递setInterval()对“render”方法的引用时,您将丢失对象上下文。

setInterval(function() { game.getGameContainer().render(); }, 16);

函数和通过属性值引用它的对象之间没有内在关系。通过使用匿名函数,您可以确保“容器”对象在“render”中的值为this

您也可以使用Function原型的.bind()方法执行此操作:

setInterval(game.getGameContainer().render.bind(game.getGameContainer()), 16);

但在这种情况下,这似乎有点难看。