JavaScriptクラスを理解する - リソースクラス

Question

JavaScript/HTML5でシンプルなビデオゲームを扱っています。クラス内のすべてのリソースを収集する考えがありました...現在、彼らは全面的に広がっています。

ので、例えば、現在、私はしかしそう

function c_resource() { 
    this.enemies.image = new Image(); 
    this.enemies.image.src = "res/enemies.png"; 

    this.tilemap.image = new Image(); 
    this.tilemap.image.src = "res/tilemap.png"; 
    .. 
    .. 
} 

として、私は単一のクラスにこれを共通化したい

function c_enemy_sprites() { 
    this.image = new Image(); 
    this.image.src = "res/enemies.png"; 
    .. 
    .. 
} 

function c_tilemap() { 
    this.image = new Image(); 
    this.image.src = "res/tilemap.png"; 
    .. 
    .. 
} 

の線に沿って何かを持って、私はドンこれが適切なアプローチだとは思わない。 2回目の実装を試してみると、プログラムはすばらしくクラッシュします。リソースの読み込みを簡素化する良い方法はありますか？

Answer 1

はすべてを保持するために、オブジェクトリテラルを作成してみてください：

あなたはまた、使用することができ

function c_resource() { 
    this.enemies = {}; 
    this.enemies.image = new Image(); 
    this.enemies.image.src = "res/enemies.png"; 
    this.tilemap = {}; 
    this.tilemap.image = new Image(); 
    this.tilemap.image.src = "res/tilemap.png"; 
    .. 
} 

：

function C_resource(src) { 
    this.image = new Image(); 
    this.image.src = src; 
} 

var resources = { 
    enemies : new C_resource('res/enemies.png'), 
    tilemap : new C_resource('res/tilemap.png') 
}; 

resources.enemies.image; // your enemies image. 

Answer 2

はであなたの画像リソースを配置するオブジェクトを初期化してみ

function Resource(path){ 
    this.image = new Image(); 
    this.image.src = path; 
    ... further initialization, etc. 
} 

次に...

function resources(){ 
    this.enemies = new Resource('res/enemies.png'); 
    this.tilemap = new Resource('res/tilemap.png'); 
}