Javascript 定时器延迟

Question

我决定尝试使用 HTML5 的 Canvas ，当然这意味着我要尝试编写一个乒乓球游戏。目前，我正试图弄清楚如何限制我的帧率。这在其他语言中相当容易，但在 Javascript 中找到一种延迟执行的方法似乎有点困难。

这是我目前所拥有的:

while(true) {
    var begin = (new Date()).getTime();

    //Draw stuff to the canvas

    var end = (new Date()).getTime();
    if ((end-begin) < 33.333 ) {
        //delay (1000/(30-(end-begin)))
    }
}

显然，由于每个 javascript 引擎的执行方式不同，帧速率会大不相同，但我想将最大帧速率限制在 30FPS。我真的不明白 setTimeout() 如何完成这项任务。执行此操作的最佳方法是什么？

Answer 1

JavaScript 中没有delay/wait。您可以使用类似 window.setTimeout 的函数在经过一定时间后调用函数，例如:

window.setTimeout(function() {
    // do something interesting
}, 2000 /* but after 2000 ms */);

或者说你想每 33 毫秒(~30 fps)绘制一帧，你可以这样编码:

window.setInterval(function() {
    // paint my frame 
}, 33);