javascript OOP 概念问题

Question

我有这个简单的代码:

// You can use either PIXI.WebGLRenderer or PIXI.CanvasRenderer
  var renderer;
  var stage;
  var bunnyTexture;
  var bunny;
  var Game= {};
 Game.Init = function() { };
 Game.Init.prototype={
    init:function(){
         renderer= new PIXI.WebGLRenderer(800, 600);
         document.body.appendChild(renderer.view);
        stage= new PIXI.Stage;
        bunnyTexture= PIXI.Texture.fromImage("img/ninja.png");
        bunny= new PIXI.Sprite(bunnyTexture);
        bunny.position.x = 400;
         bunny.position.y = 300;
       stage.addChild(bunny);

 },
  animate:function(){
       bunny.rotation += 0.01;
       renderer.render(stage);
       requestAnimationFrame(this.animate);

  }
}
    requestAnimationFrame(Game.Init.animate);

我正在这样调用该函数:

   window.onload = function () { Game.Init(); };

一个 JavaScript 错误:Argument 1 of Window.requestAnimationFrame is not an object.

Answer 1

由于 Game.Init 是一个构造函数，因此您应该使用 new 关键字正确初始化对象:

new Game.Init();

否则上下文将是全局对象Window并且this.animate是未定义。为了帮助您检测此类问题，我建议使用严格模式，该模式会在早期步骤中因错误而失败。