2015-03-02 4 views
0

Почему window.requestAnimFrame необходимо называть следующим образом: window.requestAnimFrame(this.__proto__.animate.bind(this)); и не нравится window.requestAnimFrame(this.__proto__.animate);.Почему requestAnimFrame необходимо связывать (это)

Мой JS-класс выглядит следующим образом:

Game = function (moduleConfig, gameConfig) { 
    this.moduleConfig = moduleConfig; 
    this.gameConfig = gameConfig; 

    // Game-Commands 
    this.keyCommands = { 
     moveLeft: false, 
     moveRight: false 
    }; 

    // Some init stuff 

    requestAnimFrame(this.animate.bind(this)); 


    return this; 
} 

/** 
* Init the game system 
* @param {moduleConfig} moduleCongif - Module-Config instance 
*/ 
Game.prototype = { 

    // General member 
    self: null, 
    moduleConfig: null, 
    gameConfig: null, 

    // Game member 
    renderer: null, 
    catcher: null, 
    stage: null, 

    // Nested 'static' objects 
    keyCommands: { 
     moveLeft: false, 
     moveRight: false 
    }, 


    // Some more stuff 

    /** 
    * Main loop 
    */ 
    animate: function() { 
     window.requestAnimFrame(this.__proto__.animate.bind(this)); 

     // Some more things to do 
    } 
} 

Если я не использую bind, я получаю следующее сообщение об ошибке: Failed to execute 'requestAnimationFrame' on 'Window': The callback provided as parameter 1 is not a function..

Спасибо!

ответ

1

Поскольку ваш анимационный метод - это метод игры, и поскольку его рекурсивная функция, ему нужен контекст, чтобы иметь возможность вызвать следующий анимит.

Теперь я уже говорил вам, что (или, может быть, это был кто-то), но .bind действительно плохо для использования по многим причинам - для вас главная причина его чрезвычайно медленная, и вы создаете функцию рендеринга, которая должна работать очень быстро

, чтобы избежать использования привязки я хотел бы сделать:

animate: function() { 
    var self = this 
    window.requestAnimFrame(function(){ 
     self.animate(); 
    }); 

    // Some more things to do 
} 
+0

Хорошо, теперь я понимаю, что контекст меняется в рекурсивных функциях. Это была моя проблема. – BendEg

+0

Рад, что я могу помочь –

1

window.requestAnimFrame может называть window.requestAnimationFrame который будет вызывать функцию параметр «связывания (это)» каждого second.Without, 'это. proto .animate 'будет вызывать окно. proto .animate.With 'bind (this)', это вызовет функцию анимации игры, и это будет правильно.'Bind (this) 'просто передайте контекст игры для этого.

Смежные вопросы