requestAnimationFrameの引数で指定するコールバック関数に、引数を渡したい


**現状**  
・挙動は問題ないのですが、ループ数だけ関数が必要なので簡潔に書きたい

[code]

    function loop1(){
      if(条件分岐){
        window.requestAnimationFrame(loop2);
        return;
      }
      window.requestAnimationFrame(loop1);
    }
    function loop2(){
      if(条件分岐){
        window.requestAnimationFrame(loop1);
        return;
      }
      window.requestAnimationFrame(loop2);
    }
    window.requestAnimationFrame(loop1);
    
[/code]

* * *

**やりたいことのイメージ**  
・requestAnimationFrameの引数では、コールバック関数に引数を渡せないようですが、同等内容にするにはどうすれば良いでしょうか？  
・最終的にやりたいことは、現状2つある関数を1つにしたいことなので、別に下記イメージではなくても構いません  
※条件分岐はループ内容に依存しています

[code]

    function loop(n){
      if(条件分岐){
        window.requestAnimationFrame(loop(2));
        return;
      }else if(条件分岐){
        window.requestAnimationFrame(loop(1));
        return;
      }
      if(条件分岐){
        window.requestAnimationFrame(loop(1));
      }else if(条件分岐){
        window.requestAnimationFrame(loop(2));
      }
    }
    window.requestAnimationFrame(loop(1));
    
[/code]




`bind()` してください。単純にやるなら、

[code]

    requestAnimationFrame(loop.bind(null, 2));
    
[/code]

のように書き換えます。

こういう場合は状態を管理するオブジェクトを作って、そのオブジェクトのメソッドを rAF に渡すほうがよりJavaScriptらしいと思います。

[code]

    var Animator = function() {
      this.state = 0;
      this.boundOnAnimationFrame = this.onAnimationFrame.bind(this);
      requestAnimationFrame(this.boundOnAnimationFrame);
    };
    Animator.prototype.onAnimationFrame = function() {
      if (条件分岐) {
         this.state = 2;
      } else if (条件分岐) {
         this.state = 1;
      }
      ...
      requestAnimationFrame(this.boundOnAnimationFrame);
    };
    
[/code]




`bind()` してください。単純にやるなら、

[code]

    requestAnimationFrame(loop.bind(null, 2));
    
[/code]

のように書き換えます。

こういう場合は状態を管理するオブジェクトを作って、そのオブジェクトのメソッドを rAF に渡すほうがよりJavaScriptらしいと思います。

[code]

    var Animator = function() {
      this.state = 0;
      this.boundOnAnimationFrame = this.onAnimationFrame.bind(this);
      requestAnimationFrame(this.boundOnAnimationFrame);
    };
    Animator.prototype.onAnimationFrame = function() {
      if (条件分岐) {
         this.state = 2;
      } else if (条件分岐) {
         this.state = 1;
      }
      ...
      requestAnimationFrame(this.boundOnAnimationFrame);
    };
    
[/code]

