在阅读时;“有效的javascript”;书本,不理解第38项(场景)

在阅读时;“有效的javascript”;书本,不理解第38项(场景),javascript,graph,scene,Javascript,Graph,Scene,我喜欢《有效利用……的方法》这本书。 虽然在这一点上,我觉得它有点超出我的范围(开始谈论画布和其他)。 我遇到了第38项:从子类构造函数调用超类构造函数。虽然在网络上获取图形不是这个项目的重点(或者可能是),但我很好奇,希望它能起作用,但有一件事我不明白,当我构建演员时,我需要传递什么作为“场景”。 这个例子是来自我缺少的其他库,还是缺少构建“场景”对象的代码块 下面是代码 function Scene(context, width, height, images) {

我喜欢《有效利用……的方法》这本书。 虽然在这一点上,我觉得它有点超出我的范围(开始谈论画布和其他)。 我遇到了第38项:从子类构造函数调用超类构造函数。虽然在网络上获取图形不是这个项目的重点(或者可能是),但我很好奇,希望它能起作用,但有一件事我不明白,当我构建演员时,我需要传递什么作为“场景”。 这个例子是来自我缺少的其他库,还是缺少构建“场景”对象的代码块

下面是代码

     function Scene(context, width, height, images) {
         this.context = context;
         this.width = width;
         this.height = height;
         this.images = images;
         this.actors = []; 
     }

     Scene.prototype.register = function(actor) {
        this.actors.push(actor);
     };

     Scene.prototype.unregister = function(actor) {
        var i = this.actors.indexOf(actor);
        if ( i >= 0 ) {
             this.actors.splice(i,1);
        }
     };

     Scene.prototype,draw = function() {
        this.context.clearRect(0,0, this.width, this.height);
        for (var a = this.actors, i = 0, n = a.length; i < n; i++) {
            a[i].draw();
        }

     };

     function Actor(scene,x,y) {
          this.scene = scene;
          this.x = x;
          this.y = y;
          scene.register(this);
     } 

     Actor.prototype.moveTo = function(x,y) {
        this.x = x;
        this.y = y;
        this.scene.draw();
     };

     Actor.prototype.exit = function() {
        this.scene.unregister(this);
        this.scene.draw(); 
     };

     Actor.prototype.draw = function() {
        var image = this.scene.images[this.type];
        this.scene.context.drawImage(image, this.x, this.y);
     };

     Actor.prototype.width = function() {
        return this.scene.images[this.type].width;
     };

     Actor.prototype.height = function() {
        return this.scene.images[this.type].height;
     };

     function SpaceShip(scene,x,y) {
        Actor.call(this.scene,x,y);
        this.points = 0; 
     }

     SpaceShip.prototype = Object.create(Actor.prototype);
     SpaceShip.prototype = new Actor('jot', 3,2);

     SpaceShip.prototype.type = "spaceShip";

     SpaceShip.prototype.scorePoint = function() {
         this.points++;
     };

     SpaceShip.prototype.left = function() {
        thils.moveTo(Math.max(this.x - 10, 0 ), this.y);
     };

     SpaceShip.prototype.right = function() {
         var maxWidth = this.scene.width - this.width();
         this.moveTo(Math.min(this.x + 10, maxWidth), this.y);
     };
功能场景(上下文、宽度、高度、图像){
this.context=上下文;
这个。宽度=宽度;
高度=高度;
这个。图像=图像;
this.actors=[];
}
Scene.prototype.register=函数(actor){
这个。演员。推(演员);
};
Scene.prototype.unregister=函数(actor){
var i=this.actors.indexOf(actor);
如果(i>=0){
这个.演员.剪接(i,1);
}
};
Scene.prototype,draw=function(){
this.context.clearRect(0,0,this.width,this.height);
for(var a=this.actors,i=0,n=a.length;i
Actor
函数中的
scene
参数显然是指
scene
的一个实例。此示例与名为
中介模式的模式有一些相似之处,如下所述:

顺便说一下,您的代码有一些缺陷:

 //the first argument of the `call` function is the scope, in this case `this` which refers to the newly created SpaceShip instance
 function SpaceShip(scene,x,y) {
    Actor.call(this,scene,x,y);
    this.points = 0; 
 }

 SpaceShip.prototype = Object.create(Actor.prototype);
 //you do not need this line
 //SpaceShip.prototype = new Actor('jot', 3,2);
 //but you could add this line to set the constructor property to SpaceShip
 SpaceShip.prototype.constructor = SpaceShip;

我去看看。谢谢