Question

我正在使用以下代码与Crafty。 0.5.3（导致Crafty 0.5.4，因为不明原因撞毁我的游戏，nvm，我可以使用crafty0.5.3，至少现在......）让我的玩家移动4px 8次（使整个32px）但是，通过使用超时，我希望每次延迟3毫秒，因为循环是循环（？），这样我可以有24毫秒的延迟，应该用我的动画设置。

以下是我正在使用的代码，putMessage是在我已经创建的消息框中显示一些消息的函数，此函数中的第一个参数是消息，第二个是布尔值，它告诉是否应该在消息框中添加（msg + =值）或应替换msg（仅msg = value）

    moveLeft: function() {
    for (var i = 0; i < 8; i++) {
        setTimeout(function() {
                var d= new Date();
                putMessage(i+1 + "result : " + d.getSeconds() + "." + d.getMilliseconds() + "<br/ >", true);
                this.move('w',4);
                this.borderCheck();
                putMessage(d.getSeconds() + "." + d.getMilliseconds() + "<br>", true);
        }, 3)
    }
  },

这是消息框中的结果，请考虑在1digit之后不要花费几毫秒 9结果：49.493
结果：49.493
结果：49.493
结果：49.509
结果：49.509
结果：49.509
结果：49.509
9结果：49.509

看到'9'，为什么有9，因为我猜，应该有像1result，2result，.... 8result，.... 9应该不是任何地方......和第二个putMessage没有'似乎工作....两个玩家都没有被移动。但是如果删除setTimeout（），

moveLeft: function() {
    for (var i = 0; i < 8; i++) {
        var d= new Date();
            putMessage(i+1 + "result : " + d.getSeconds() + "." + d.getMilliseconds() + "<br/ >", true);
            this.move('w',4);
            this.borderCheck();
            putMessage(d.getSeconds() + "." + d.getMilliseconds() + "<br>", true);
    }
  },

在消息框中获得的结果是，
1结果：36.176
36.176
结果：36.176
36.176
结果：36.176
36.176
结果：36.176
36.176
结果：36.192
36.192
结果：36.192
36.192
结果：36.192
36.192
结果：36.192
36.192

见？完美....更重要的是，玩家移动..！

那么setTimeout实际上做了什么....顺便说一下，它在其他地方工作得很好，所以设置任何限制，就像只执行前两行代码一样？

请帮助，我对这种语言还很陌生。

提前致谢：D

编辑：我在for循环

之前添加以下行后解决了这个问题

intPlayer = this; //intPlayer = internalPlayer;

然后我用“intPlayer.move”和“intPlayer.borderCheck（）”改变了“this.move”和“this.borderCheck（）”......事情变得很好......

有人可以解释原因吗？

Answer 1

回答为什么setTimeout中的背景不同：
setTimeout函数将回调函数保存到队列中。当时间正确时，将调用回调函数。问题是你的回调函数的上下文会丢失 - 它不知道你从哪个对象调用了setTimeout，所以它不能调用回调函数，而this设置为< strong>上述对象。
取自MDN's setTimeout文档页面。

Crafty.js：遇到setTimeout问题

1 个答案: