Comment choisir entre le prototypage et la fermeture pour créer des objets personnalisés en JavaScript ?

Comment créer des objets personnalisés en JavaScript

JavaScript propose différentes approches pour créer des objets personnalisés. Voici deux modèles distincts :

Façon de prototypage

Le modèle de prototypage est natif de JavaScript. Cela implique d'utiliser la propriété prototype d'une fonction constructeur pour ajouter des propriétés et des méthodes aux instances :

function Shape(x, y) {
  this.x = x;
  this.y = y;
}

Shape.prototype.toString = function() {
  return 'Shape at ' + this.x + ', ' + this.y;
};

function Circle(x, y, r) {
  Shape.call(this, x, y); // Invoke base constructor
  this.r = r;
}

Circle.prototype = new Shape(); // Inherit prototype

Circle.prototype.toString = function() {
  return 'Circular ' + Shape.prototype.toString.call(this) + ' with radius ' + this.r;
};

Avantages :

• Léger et natif de JavaScript
• Réutilisations prototype existant
• Supports instanceof

Inconvénients :

• Le constructeur de base doit être appelé dans le constructeur de sous-classe
• Nécessite la gestion du constructeur lors du sous-classement

Closure Way

Le modèle de fermeture évite l'héritage en utilisant des fermetures pour entourer des données et des méthodes spécifiques à une instance :

function Shape(x, y) {
  var that = this;

  this.x = x;
  this.y = y;

  this.toString = function() {
    return 'Shape at ' + that.x + ', ' + that.y;
  };
}

function Circle(x, y, r) {
  var that = this;

  Shape.call(this, x, y);
  this.r = r;

  var _baseToString = this.toString;
  this.toString = function() {
    return 'Circular ' + _baseToString.call(that) + ' with radius ' + that.r;
  };
};

var mycircle = new Circle();

Avantages :

• Empêche le partage d'instance de méthodes
• Liaison automatique des méthodes aux instances

Inconvénients :

• Moins efficace en raison de copies de méthodes par instance
• Impossible d'utiliser instanceof sans logique personnalisée

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!