Javascript 为什么此requestAnimationFrame设置无法正确执行？_Javascript_Requestanimationframe

Javascript 为什么此requestAnimationFrame设置无法正确执行？

javascript

Javascript 为什么此requestAnimationFrame设置无法正确执行？,javascript,requestanimationframe,Javascript,Requestanimationframe,渲染画布的函数是一个类的原型方法，如下所示： Engine.prototype.renderCameras = function() { console.log('render ok'); } window.requestAnimFrame(engine.renderCameras) >>> 0 当我尝试在Chrome或Firefox中使用requestAnimationFrame运行它时，我得到以下结果： window.requestAnimFrame(en

渲染画布的函数是一个类的原型方法，如下所示：

Engine.prototype.renderCameras = function() { console.log('render ok'); }

window.requestAnimFrame(engine.renderCameras)
>>> 0

当我尝试在Chrome或Firefox中使用requestAnimationFrame运行它时，我得到以下结果：

window.requestAnimFrame(engine.renderCameras())
>>> render ok
>>> Error: Component returned failure code: 0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS) [nsIDOMWindow.mozRequestAnimationFrame]

它运行，但总是抛出错误。那不酷

当我尝试这样运行它时：

Engine.prototype.renderCameras = function() { console.log('render ok'); }

window.requestAnimFrame(engine.renderCameras)
>>> 0

它什么也不做

我可以通过使用闭包来解决这个问题，但我仍然想知道为什么不能将这样的函数传递给requestAnimationFrame

window.requestAnimFrame(engine.renderCameras())

不是将函数传递给

requestAnimFrame

，而是将

引擎的返回值传递给requestAnimFrame
。返回值可能不是函数，因此会出现此错误
window.requestAnimFrame(engine.renderCameras)

相反，正确地传递函数引用，但在renderCameras
内部不会引用引擎。如果依赖于此（我根据设置假设），则必须正确地传递函数调用engine.renderCameras
：
window.requestAnimFrame(function(){
    engine.renderCameras();
});

或用于显式设置（并绑定）此
：
window.requestAnimFrame(engine.renderCameras.bind(engine));

无论哪种方式，您都必须反复调用window.requestAnimFrame
，以获取下一个动画帧，这意味着您通常使用递归函数。例如：
window.requestAnimFrame(function render(){
    engine.renderCameras();
    window.requestAnimFrame(render);
});

不是将函数传递给requestAnimFrame
，而是将引擎的返回值传递给requestAnimFrame
。返回值可能不是函数，因此会出现此错误
window.requestAnimFrame(engine.renderCameras)

相反，正确地传递函数引用，但在renderCameras
内部不会引用引擎。如果依赖于此（我根据设置假设），则必须正确地传递函数调用engine.renderCameras
：
window.requestAnimFrame(function(){
    engine.renderCameras();
});

或用于显式设置（并绑定）此
：
window.requestAnimFrame(engine.renderCameras.bind(engine));

无论哪种方式，您都必须反复调用window.requestAnimFrame
，以获取下一个动画帧，这意味着您通常使用递归函数。例如：
window.requestAnimFrame(function render(){
    engine.renderCameras();
    window.requestAnimFrame(render);
});

啊，对了，我以前从未实际使用过.bind（），但这是一个完美的测试用例。实际上，我将requestAnimationFrame放在一个常规的setinterval内，这样我就可以设置目标fps.Aah-right，我以前从未实际使用过.bind（），但这是一个完美的测试用例。实际上，我将requestAnimationFrame放在一个固定的设置间隔内，这样我就可以设置一个目标fps。