Quel style utilisez-vous pour créer une « classe » ?

Question

Il existe plusieurs façons d'obtenir un comportement de type classe en javascript, la plus courante semble être basée sur un prototype comme celui-ci :

function Vector(x, y, x) {
    this.x = x;
    this.y = y;
    this.z = z;
    return this;
}

Vector.prototype.length = function () { return Math.sqrt(this.x * this.x ... ); }

et des approches basées sur la fermeture similaires à

function Vector(x, y, z) {
    this.length = function() { return Math.sqrt(x * x + ...); }
}

Pour diverses raisons, ce dernier est plus rapide, mais j'ai vu (et j'écris fréquemment) la version prototype et j'étais curieux de savoir ce que faisaient les autres.

Answer 1

Il est préférable d'attribuer des fonctions au prototype (pour les méthodes publiques) car toutes les instances de la classe partageront la même copie de la méthode.Si vous affectez la fonction à l'intérieur du constructeur comme dans le deuxième exemple, chaque fois que vous créez une nouvelle instance, le constructeur crée une nouvelle copie de la fonction de longueur et l'affecte uniquement à cette seule instance.

Cependant cette dernière technique est utile si vous vouloir chaque copie doit avoir sa propre copie, l'utilisation principale étant de créer des méthodes privées/privilèges qui ont accès aux variables privées déclarées à l'intérieur du constructeur et héritées via le mécanisme de fermeture.

Douglas Crockford a un bon résumé.

Answer 2

Il existe également une approche littérale objet du prototype :

var Vector = function(){};

Vector.prototype = {
  init:function(x,y,z) {
    this.x = x;
    this.y = y;
    this.z = z;
  },
  length:function() {
    return Math.sqrt(x * x + ...);
  }
};

var v1 = new Vector();
v1.init(1,2,3);

Answer 3

Heureusement, je peux utiliser prototype.js, qui fournit de jolis emballages.Vous pouvez donc faire ceci :

var Person = Class.create({
    initialize: function(name) {
        this.name = name;
    },
    say: function(message) {
        return this.name + ': ' + message;
    }
});

Prototype.js Documentation:Définir les classes et l'héritage

Answer 4

Eh bien, je n'ai pas vraiment d'avis d'expert à ce sujet.Je finis généralement par utiliser une approche basée sur les fermetures simplement parce qu'elle simplifie la gestion du code.Mais je me suis retrouvé à utiliser des prototypes pour des méthodes comportant de nombreuses lignes de code.

Answer 5

Vous avez également le choix entre :

function Vector(x, y, z) {
  function length() {
    return Math.sqrt(x * x + ...);
  }
}

Ce qui est probablement aussi lent que le deuxième exemple, mais cela ressemble plus à Java/C# et est un peu plus explicite.

Answer 6

Je suis un grand fan de l'utilisation La bibliothèque de John Resig pour ça.Léger, simple, et vous savez déjà comment l'utiliser si vous êtes familier avec le style orienté objet « habituel ».

Answer 7

Il n'y a pas de cours en javascript.

Il y a cependant des objets.Vous n'avez pas besoin d'une classe pour créer un objet en javascript.Il a des fonctions de construction que vous pouvez appeler avec new par exemple :

var james = new Person();

Vous pouvez simuler un comportement de classe avec :

exemple de prototype :

function Car (type) {
    this.type = type;
    this.color = "red";
}

Car.prototype.getInfo = function() {
    return this.color + ' ' + this.type + ' car';
};

exemple d'objet littéral

var car = {
    type: "honda",
    color: "red",
    getInfo: function () {
        return this.color + ' ' + this.type + ' car';
    }
}