Understanding JavaScript classes - resource class
Working on a simple video game in JavaScript / HTML5, and I had a thought to collect all of my resources within one class...currently they're spread all over the place.
So, for an example, currently I have something along the lines of
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";
..
..
}
I'd like to commonize this into a single class, as so
function c_res开发者_开发百科ource() {
this.enemies.image = new Image();
this.enemies.image.src = "res/enemies.png";
this.tilemap.image = new Image();
this.tilemap.image.src = "res/tilemap.png";
..
..
}
However, I don't think this is the proper approach. The program crashes spectacularly when I try the second implementation. Is there a good way to simplify my resource loading?
Try creating an object literal to hold everything:
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.
Try initializing an object to put your image resource in:
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";
..
}
You also could use:
function Resource(path){
this.image = new Image();
this.image.src = path;
... further initialization, etc.
}
then...
function resources(){
this.enemies = new Resource('res/enemies.png');
this.tilemap = new Resource('res/tilemap.png');
}
精彩评论