从新对象中运行requestAnimationFrame [英] running requestAnimationFrame from within a new object

问题描述

我在运行动画时遇到了麻烦。这是在 var ob1 = function（）{}; 中。调用时，它运行一段时间然后我得到错误未捕获的RangeError：超出最大调用堆栈大小。但是，同样的结构在对象外部运行没有问题。

I'm having trouble running an animation. This is inside var ob1 = function() {};. When called, it runs for a while and then I get the error Uncaught RangeError: Maximum call stack size exceeded. However, this same structure has no problems running outside of the object.

/////////////// Render the scene ///////////////
this.render = function (){

        renderer.render(scene,camera);
        if(isControls == true) controls.update(clock.getDelta());
        this.animate();
        //console.log(true);
        requestAnimationFrame(this.render());
}

/////////////// Update objects ///////////////
this.animate = function (){
        console.log("!");
}

推荐答案

你应该传递一个函数参考到 requestAnimationFrame ，不调用函数：

You should pass a function reference to requestAnimationFrame, not invoke the function:

requestAnimationFrame(this.render);

因为你在里面使用里面渲染，您可能需要 bind ：

Since you're using this inside render, you'll probably need bind:

requestAnimationFrame(this.render.bind(this));

您的版本导致堆栈溢出（该函数同步调用自身，直到调用堆栈已满）。

Your version is causing a Stack Overflow (the function is calling itself synchronously, until the call stack is full).

这篇关于从新对象中运行requestAnimationFrame的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！