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是undefined。爲了幫助您檢測出這樣的問題，我建議您使用use strict模式，這種模式在很早的階段就會失敗並報錯。