requestAnimationFrame 附加到 App 对象而不是 Window

Question

我已经设置了以下jsFiddle http://jsfiddle.net/ZbhQY/4/

我正在使用一个小的 requestAnimationFrame polyfill 并将结果返回给 window.reqeuestAnimFrame 这一切正常，并且对该函数的所有调用都按预期工作。

如果我将其更改为返回到 game.reqeuestAnimFrame 并将所有对 window.reqeuestAnimFrame 的调用替换为新的 game.reqeuestAnimFrame 它将不再起作用。

有人能解释一下为什么会这样吗？我可以做些什么来完成这项工作？ 谢谢。

Answer 1

requestAnimationFrame 必须具有window 的上下文才能正常运行。

您可以将调用重写为：

game.requestAnimFrame.call(win, game.run);

它将按预期运行。

您遇到的错误是因为 requestAnimationFrame 期望它的上下文 (this) 是 window，但它的上下文是 game。

http://jsfiddle.net/ZbhQY/5/

或者，您可以像这样重写您的 requestAnimFrame getter：

game.requestAnimFrame = (function() {
        var rAF = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
        function(callback) {
            window.setTimeout(callback, 1000 / 60);
        };

        return function(callback){
            rAF.call(window, callback);
        };            
    })();

这将允许您像您期望的那样调用game.requestAnimFrame(game.run)。