Question

我试图为这个游戏制作一个计时器，它会从每1000毫秒30秒倒计时，但是当我运行代码时，计时器确实会改变;它保持在30岁。

以下是我正在使用的代码：

var gameTimer = {
    time: 30,
    interval: undefined,
    start: function(time) {
        var self = this;
        this.interval = setInterval(tick, 1000);
    },
    tick: function() {
        this.time = this.time - 1;
    },
    stop: function(time){
        clearInterval(this.interval);
    },
    reset: function(){
        this.time = 30;
    }
};

有人可以帮帮我吗？

Answer 1

从此改变：

this.interval = setInterval(tick, 1000);

到此：

this.interval = setInterval(this.tick.bind(this), 1000);

问题在于，当您将tick传递给setInterval时，在调用tick()时对象引用会丢失，因此this的值不正确。由于time值错误，您最终可能会更改名为this的全局变量。

传递this.tick.bind(this)会导致this指针在间隔调用tick()时正确设置，因此该方法中的this.time引用正常工作。

仅供参考，如果您在严格模式下工作，运行时会向您指出错误，因为this未定义而不是window（严格模式的原因之一））。

Answer 2

这样做

var gameTimer = function() {
    this.time = 30;
    this.interval;

    this.start = function() {
        self = this;
        this.interval = setInterval(this.tick.bind(this), 1000);
        console.log(this.interval);
    };
    this.tick = function() {
        console.log(this.time);
        this.time = this.time - 1;
    };
    this.stop = function(){
        clearInterval(this.interval);
    };
    this.reset = function(){
        this.time = 30;
    };
};
var timer = new gameTimer();
timer.start();

小提琴演示http://jsfiddle.net/jL2jc4jr/

在代码示例中，我没有把代码停止，但我认为你可以从这一点开始。享受你的游戏计时器。

Javascript Timer不会改变状态

2 个答案: