1

キャンバスをレンダリングする関数は、次のようなクラスのプロトタイプ メソッドです。

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

このコードを直接実行しようとすると、正常に動作します。

engine.renderCameras()
>>> render ok

Chrome または Firefox で requestAnimationFrame を使用して実行しようとすると、次のようになります。

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

実行されますが、常にエラーがスローされます。それはクールではない。

次のように実行しようとすると：

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

それは何もしません。

クロージャーを使用してこの問題を解決できましたが、そのような関数を requestAnimationFrame に渡すことができない理由を知りたいです。

4

1 に答える 1

8 
window.requestAnimFrame(engine.renderCameras())

に関数を渡すのではなく、 の戻り値をにrequestAnimFrame渡しています。戻り値はおそらく関数ではないため、このエラーが発生します。engine.renderCamerasrequestAnimFrame

window.requestAnimFrame(engine.renderCameras)

代わりに関数参照を正しく渡しますが、内部のthis [docs]renderCamerasは を参照しませんengine。engine.renderCamerasあなたがそれに依存している場合（私はセットアップに基づいていると思います）、適切に呼び出す関数を渡す必要があります：

window.requestAnimFrame(function(){
    engine.renderCameras();
});

または.bind [docs]thisを使用して明示的に設定 (およびバインド) します。

window.requestAnimFrame(engine.renderCameras.bind(engine));

いずれにしても、次のアニメーション フレームを取得するために繰り返し呼び出す必要がwindow.requestAnimFrameあります。つまり、通常は再帰関数を使用します。例えば：

window.requestAnimFrame(function render(){
    engine.renderCameras();
    window.requestAnimFrame(render);
});
于 2012-08-24T00:52:45.993 に答える