Понимание классов JavaScript - класс ресурсов

Question

Работая над простой видеоигрой на JavaScript / HTML5, я подумал собрать все свои ресурсы в одном классе ... в настоящее время они распределены повсюду.

Так, например, в настоящее время у меня есть что-то вроде

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";
  ..
  ..
}

Я хотел бы объединить это в один класс, так что

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";
  ..
  ..
}

Однако я не думаю, что это правильный подход. Программа эффектно падает, когда я пробую вторую реализацию. Есть ли хороший способ упростить загрузку моего ресурса?

Answer 1

Попробуйте создать литерал объекта для хранения всего:

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 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 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');
}