javascript - 超过请求动画帧最大调用堆栈的绘图？

Question

我正在制作自己的小画布库，因为我有时间消磨时间并尝试为画布对象设置动画，该方法目前看起来像这样；

proto.update = function () {


    for (var i = 0; i < this.objects.length; ++i) {

        this.objects[i].draw(this.context);
    }

    var self = this;

    requestAnimationFrame(self.update());
};

我以前没有使用requestAnimationFrame过，我收到一条错误消息，说超出了最大调用堆栈。

我遵循本教程http://creativejs.com/resources/requestanimationframe/并且很确定我没有犯任何错误。

我做错什么了？

Answer 1

传递给的回调参数requestAnimationFrame应该是对下一次重绘时要调用的函数的引用（请参阅此处的文档）。您的错误是您在函数名称后包含了括号，这意味着它立即执行导致递归循环。

尝试按如下方式更新您的代码：

proto.update = function () {


    for (var i = 0; i < this.objects.length; ++i) {

        this.objects[i].draw(this.context);
    }

    var self = this;

    // Pass the function reference don't call it
    requestAnimationFrame(self.update);
};