Maison > interface Web > js tutoriel > Introduction à diverses combinaisons d'héritage en JavaScript (exemples de code)

Introduction à diverses combinaisons d'héritage en JavaScript (exemples de code)

不言
Libérer: 2019-01-19 10:54:18
avant
2368 Les gens l'ont consulté

Cet article vous présente une introduction à divers héritages de combinaisons en JavaScript (exemples de code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. .

1. Héritage combiné  : Également appelé héritage pseudo-classique, il fait référence à une méthode d'héritage qui combine une chaîne de prototypes et une technologie de constructeur empruntée.

Regardons un exemple :

function SuperType(name) {
    this.name = name;
    this.colors = ["red", "blue", "green"];
  }
  SuperType.prototype.sayName = function() {
    alert(this.name);
  }
  function SubType(name, age) {
    SuperType.call(this, name);
    this.age = age;
  }
 
  //继承方法
  SubType.prototype = new SuperType();
  SubType.prototype.sayAge = function() {
    alert(this.age);
  }
 
  var instance1 = new SubType("Nicholas", 29);
  instance1.colors.push("black");
  alert(instance1.colors); //red,blue,green,black
  instance1.sayName(); //Nicholas
  instance1.sayAge(); //29
 
  var instance2 = new SubType("Greg", 27);
  alert(instance2.colors); //red,blue,green
  instance2.sayName(); //Greg
  instance2.sayAge(); //27
Copier après la connexion

L'héritage combiné évite les défauts des chaînes de prototypes et des constructeurs empruntés et combine leurs avantages .

2. Héritage prototypique

L'héritage peut être implémenté sans avoir à définir un constructeur à l'avance. Son essence est d'effectuer une copie superficielle d'un objet donné. La copie copiée peut également être transformée davantage.

function object(o) {
    function F(){};
    F.prototype = o;
    return new F;
  }
 
  var person = {
   name: "Nicholas",
   friends: ["Shelby", "Court", "Van"]
  };
 
  var antherPerson = object(person);
  antherPerson.name = "Greg";
  antherPerson.friends.push("Rob");
 
  var antherPerson = object(person);
  antherPerson.name = "Linda";
  antherPerson.friends.push("Barbie");
 
  alert(person.friends); //Shelby,Court,Van,Rob,Barbie
Copier après la connexion

3. L'héritage parasite

est très similaire à l'héritage prototypique et est également basé sur un objet. Ou créez un objet avec des informations, puis améliorez l'objet et enfin renvoyez l'objet. Pour résoudre le problème d'inefficacité causé par le modèle d'héritage combiné en raison de plusieurs appels au constructeur de supertype, vous pouvez utiliser ce modèle avec l'héritage combiné.

function object(o) {
    function F(){};
    F.prototype = o;
    return new F;
  }
  function createAnother(original) {
    var clone = object(original);
    clone.sayHi = function() {
      alert("Hi");
    };
    return clone;
  }
 
  var person = {
    name: "Nicholas",
    friends: ["Shelby", "Court", "Van"]
  };
 
  var anotherPerson = createAnother(person);
  anotherPerson.sayHi();
Copier après la connexion

4. Héritage combiné parasite

Il combine les avantages de l'héritage parasitaire et de l'héritage combiné, est le moyen le plus efficace d’implémenter l’héritage de type de base.

//继承原型
  function extend(subType, superType) {
    function F(){};
    F.prototype = superType.prototype;
 
    var prototype = new F;
    prototype.constructor = subType;
    subType.prototype = prototype;
  }
 
  //超类方法
  function SuperType(name) {
    this.name = name;
    this.colors = ["red", "blue", "green"];
  }
  SuperType.prototype.sayName = function() {
    return this.name;
  }
 
  //子类方法
  function SubType(name, age) {
    SuperType.call(this, name);
    this.age = age;
  }
 
  //继承超类的原型
  extend(SubType, SuperType);
 
  //子类方法
  SubType.prototype.sayAge = function() {
    return this.age;
  }
 
  var instance1 = new SubType("Shelby");
  var instance2 = new SubType("Court", 28);
 
  instance1.colors.push('black');
 
  alert(instance1.colors); //red,blue,green,black
  alert(instance2.colors); //red,blue,green
 
  alert(instance1 instanceof SubType); //true
  alert(instance1 instanceof SuperType); //true
Copier après la connexion

La grande efficacité de cet exemple est qu'il n'appelle le constructeur SuperType qu'une seule fois, et évite ainsi la création inutile d'attributs redondants SubType.prototype. Dans le même temps, la chaîne prototype peut rester inchangée. Par conséquent, instanceof et isPrototypeOf() peuvent toujours être utilisés normalement. Les développeurs pensent généralement que l'héritage compositionnel parasite est le paradigme d'héritage le plus idéal pour les types de référence.

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!

Étiquettes associées:
source:cnblogs.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal