如何在对象创建上运行函数?

时间:2012-07-10 01:08:57

标签: javascript jquery canvas

问题:

我正在创建一个HTML5画布游戏,我想为我的船创建一个对象,它将船的src分配给images / powship.png。它可以工作,如果我创建船,然后将i变量分配给src,但我想知道我是否可以在我建造船时一次性完成。

如果我做这样的事情就行了:

ship = { //a class for my ship
    x : $(window).width()/2,
    y : $(window).height()/2,
    i : new Image()
}
ship.i.src="images/powship.png";

当我创造我的船时,我想立刻做到这一切(为了让事情保持在一起)。像这样:

ship = { //a class for my ship
    x : $(window).width()/2,
    y : $(window).height()/2,
    i : new Image(),
    src : function() {
        return this.i.src="images/powship.png"
    }
}

但它似乎不起作用。

Code that works is here

Demo here

Unminified JS file

问题:

如何在对象创建上运行函数?

3 个答案:

答案 0 :(得分:2)

函数ship.src();未运行,这就是.src未设置的原因。

您的船级可能希望在创建时运行更多内容,因此构造函数是合适的。

var Ship = function(){
    // set up basic components of your class
    this.x = $(window).width()/2;
    this.y = $(window).height()/2;
    this.i = new Image(); 

    // preform any construction requirements
    this.i.src = "images/powship.png";
};

var ship = new Ship();

或者你可以这样说:

var ship = function(){
    result = {
       x : $(window).height()/2,
       y : $(window).height()/2,
       i : new Image()
    }
    result.i.src = "images/powship.png";
    return result;
};

答案 1 :(得分:1)

您应该创建一个构造函数,让您重用代码。

function Ship() {
    var win = $(window);
    this.x = win.width()/2;
    this.y = win.height()/2;
    this.i = new Image();
    this.src = this.i.src = "images/powship.png";
}

var ship1 = new Ship();
var ship2 = new Ship();

你不能做你想要做的事情,因为在你创建对象之前它不存在所以你在用文字符号创建它时不能引用它的属性。

答案 2 :(得分:-1)

i : new Image({src : "images/powship.png" })

试试,应该有效。