1

我正在尝试使用套接字创建一个 javascript 游戏,但我陷入了对象的 OOP 问题。我在从对象函数内部引用对象变量时遇到问题。

这里可能有几个问题。我从对象内部调用绘图函数,而不是渲染函数。我也不确定对象字面量设计是否正确。

使用 Require.js 和 class.js,我们有 User.js :

    define(['entity'],function(Entity){
var User = Entity.extend({
    init: function(){
        this.health= 10;

    },

    draw: function(ctx){
        img = new Image();   // Create new img element
        img.onload = function(){
        // execute drawImage statements here
        ctx.drawImage(img, this.posx, this.posy);
        };
        img.src = '/images/object.PNG'; // Set source path
    }
})
return User;})

从 Entity.js 扩展

    define(function(){
var Entity= Class.extend({
    init: function(){
        //object image
        this.img.src = '/images/Blue-soldier.PNG';
        //location
        this.posx=50;
        this.posy=50;
        //gameplay values
        this.health=1;
        this.speed=0;

    },

User.draw(ctx) 在 game.js 中被调用:

    var entity = new User;
    this.users.push(entityid);
    entity.draw(ctx);
},

this.posx 和 this.posy 在 user.draw() 中无法识别。当它们被硬值替换时,它工作正常。我错过了什么?

我的完整代码有点混乱,但您可以在https://github.com/mtbarta/canvas/blob/master/public/javascripts/client.js找到它

谢谢!

4

1 回答 1

1

问题是您试图this在“加载”处理程序中使用,其中的值不会是“绘制”函数中的值。尝试这个:

    var entity = this;
    img.onload = function(){
      // execute drawImage statements here
      ctx.drawImage(img, entity.posx, entity.posy);
    };

通过在局部变量“entity”中保留一个副本this,处理程序将可以访问它。

于 2012-12-27T00:22:20.847 回答