我正在使用JavaScript开发游戏,我使用requestAnimationFrame
进行游戏循环设置:
loop: function () {
game.updateSomething();
if (game.running) {
game.tick++;
requestAnimationFrame(game.loop);
}
},
我的游戏有一个工作循环,我能够移动物体,这一切都很好,但是如果我想限制这个循环中的动作到每一秒,例如,我怎么能实现这个?我是否必须记下new Date()
每次打勾的时间,然后将其与我在前一次循环生成时计算的时间进行比较,并测试差异?像这样:
latest: null,
loop: function () {
var last = this.latest;
this.latest = new Date().getTime();
var every = 200;
if (Math.floor(last/every) != Math.floor(this.latest/every)) {
console.log('do something');
game.updateSomething();
};
if (game.running) {
game.tick++;
requestAnimationFrame(game.loop);
}
},
这看起来非常混乱,即使我把它包装在一个函数中,当这个函数返回true时,那个地板上的地板时间不同,它只是感觉不对...我试着谷歌搜索但我找不到任何东西这具体解决了这个问题。
其他JavaScript游戏如何处理需要定期发生的事情,这也存在于主游戏循环中?
答案 0 :(得分:0)
来自MDN:
回调方法传递一个参数,a DOMHighResTimeStamp,用毫秒表示时间,但用 最小精度为10μs,重新计划安排在此精度 发生。
上述时间戳可用于衡量raf呼叫之间的时间,正好符合您的需要:
var last = sec = dev = 0,
every = 1000;
var cycle = function (stamp) {
if (stamp - last >= every - dev) {
last = stamp;
sec++;
dev = last - sec * every;
console.log(sec+" sec, deviation: " + dev);
}
requestAnimationFrame(cycle);
};
requestAnimationFrame(cycle);
控制台输出:
[13:09:55.790] "1 sec, deviation: 14"
[13:09:56.786] "2 sec, deviation: 12"
[13:09:57.782] "3 sec, deviation: 10"
[13:09:58.779] "4 sec, deviation: 9.000000000000455"
[13:09:59.777] "5 sec, deviation: 7"
[13:10:00.776] "6 sec, deviation: 6"
[13:10:01.773] "7 sec, deviation: 4"
[13:10:02.773] "8 sec, deviation: 3"
[13:10:03.773] "9 sec, deviation: 1"
[13:10:04.787] "10 sec, deviation: 15"
[13:10:05.786] "11 sec, deviation: 13"