WEB-d Développement Web

PHP, SQL, HTML5, CSS3, Javascript, Mootools, Référencement, SEO, CMS, e-commerce, Apache, Linux, Ubuntu, ...

Définir une classe Javascript

Javascript possède un modèle orienté objet mais, contrairement à des langages comme Java ou PHP, il n'existe pas de syntaxe permettant de définir une classe.

Lorsqu'on souhaite instancier un objet, on doit en réalité appeler une fonction qui construit l'entièreté de l'objet:


function Animal(nom) {
  this.nom = nom;

  this.toString = function() {
    return "Je m'appelle " + this.nom + "!";
  }
}

var chat = new Animal('Tigrou');
alert(chat.toString());
 

Cette méthode est cependant très gourmande en mémoire RAM: chaque instance de la classe Animal contient la valeur de chaque attribut (normal), mais également la définition de chaque méthode, alors que celles-ci sont les mêmes pour chaque instance!

Pour éviter ce gaspillage, il faut recourir aux prototypes. Les prototypes sont similaires au mot clé static en Java ou PHP: ils indiquent à Javascript que cette définition est commune à tous les objets (de cette "classe").


function Animal(nom) {
  this.nom = nom;
}

Animal.prototype.toString = function() {
  return "Je m'appelle " + this.nom + "!";
}

var chat = new Animal('Tigrou');
alert(chat.toString());
 

Cette fois-ci, l'inconvénient est que la définition de la classe est complètement séparée entre le constructeur qui définit les attributs de l'objet, et les prototypes pour chaque méthode. La plus-part des frameworks javascript proposent donc une méthode pour définir une classe. Dans le cas de jQuery, il s'agit de Class.create():


var Animal = Class.create({
  init: function(nom) {
    this.nom = nom;
  },

  toString: function() {
    return "Je m'appele " + this.nom + "!");
  }
});

var chat = new Animal('Tigrou');
alert(cat.toString());
 

Articles similaires