Comprendre l'héritage en JS

Héritage prototypique de js

La chaîne de prototypes est la principale méthode pour implémenter l'héritage js. Son principe est d'utiliser des prototypes pour laisser un type de référence hériter des propriétés et des méthodes d'un autre type de référence. Si nous rendons un objet prototype égal à une instance, alors l'objet prototype contiendra à ce moment un pointeur vers un autre prototype. Si un autre prototype est égal à une instance d'un objet, c'est le concept de base de la chaîne de prototypes.

Ce qui suit est un exemple simple

    var Parent = function(){
        this.name = 'parent' ;
    } ;
    Parent.prototype.getName = function(){
        return this.name ;
    } ;
    Parent.prototype.obj = {a : 1} ;    var Child = function(){
        this.name = 'child' ;
    } ;
    Child.prototype = new Parent() ;    var parent = new Parent() ;    var child = new Child() ;
    console.log(parent.getName()) ; //parent
    console.log(child.getName()) ; //child

Le code ci-dessus définit deux types : parent et enfant. Chaque type a une propriété et une méthode. La principale différence entre eux est que l'enfant hérite du parent. L'héritage est obtenu en créant une instance de parent et en attribuant cette instance à child.prototype. en le remplaçant par une nouvelle instance. Affectez directement l'objet de la classe parent au prototype du constructeur de sous-classe, afin que l'objet de la sous-classe puisse accéder aux propriétés du prototype de la classe parent et du constructeur de la classe parent.
Nous pouvons utiliser l'opérateur instanceof pour juger. Utilisez cet opérateur pour tester l'instance et le constructeur qui apparaît dans la chaîne de prototypes, et il retournera vrai

---

Emprunter le constructeur

Qu'est-ce que le constructeur

Le constructeur JavaScript n'existe pas en tant que méthode spécifique d'une classe ; lorsqu'une fonction ordinaire est utilisée pour créer une classe d'objets, elle est appelée constructeur, ou constructeur. Pour qu'une fonction serve de véritable constructeur, elle doit remplir les conditions suivantes :

1. Définissez les propriétés du nouvel objet (this) à l'intérieur de la fonction, généralement en ajoutant des propriétés et des méthodes.

2. Le constructeur peut contenir une instruction return (non recommandé), mais la valeur de retour doit être celle-ci, ou une autre valeur de type non-objet.

Un domaine qui prête facilement à confusion à propos des constructeurs JavaScript est l'attribut constructeur du prototype. En JavaScript, chaque fonction a un prototype d'attribut d'objet prototype par défaut, qui contient deux attributs membres par défaut : constructeur et
proto. Les détails du prototype ne seront pas abordés dans cet article. Ce qui nous préoccupe maintenant, c'est l'attribut constructeur.

Selon la pensée habituelle orientée objet, nous disons que le constructeur est équivalent à la définition de "classe", nous pouvons donc penser que l'attribut constructeur est le véritable constructeur de la classe lors de la nouvelle expression. crée un objet Parfois, le constructeur sera appelé directement pour initialiser l'objet, ce qui est une grosse erreur. Le processus réel d'exécution de la nouvelle expression a été présenté ci-dessus (quatre étapes). La troisième étape est utilisée pour initialiser l'objet. La fonction d'initialisation appelée est la "fonction de classe" elle-même, pas le constructeur

Emprunter l'héritage du constructeur

    function CO(){
    this.p = “I’m in constructed object”;    this.alertP = function(){
        alert(this.p);
        }
    }    var o2 = new CO();

L'idée de base est très simple, c'est-à-dire appeler le constructeur de supertype à l'intérieur du constructeur de sous-type. Étant donné que les fonctions ne sont rien d'autre que des objets qui exécutent du code dans un environnement spécifique, les constructeurs peuvent également être exécutés sur des objets nouvellement créés en utilisant les méthodes apply() et call().

En utilisant call(), nous appelons en fait le constructeur supertype() dans le contexte de l'instance de sous-type nouvellement créée. De cette façon, le constructeur de supertype sera exécuté sur le nouvel objet de sous-type. donc tout le code d'initialisation de l'objet défini dans la fonction supertype() sera exécuté sur l'objet sous-type

   function superType(){
       this.colors = ["red","blue","green"];
   }   function subtype(){
       superType.call(this);
   }   var instance1 = new subtype();
   instance1.colors.push("black");
   alert(instance1.colors);//"red,blue,green,black"
   var instance2 = new subtype();
   alert(instance2.colors);//"red,blue,green"

C'est un grand avantage du constructeur, vous pouvez l'ajouter au supertype dans le constructeur de sous-type Constructeur transmet les paramètres.

   function superType(name){
       this.name = name;
   }   function subtype(){
       superType.call(this,"Marry");       this.age = 29;
   }   var instance = new subtype();
   alert(instance.name);//"Marry"
   alert(instance2.age);//"29"

Cet article explique la compréhension de l'héritage JS. Pour plus de contenu connexe, veuillez faire attention au site Web php chinois.

Recommandations associées :

Déchiffrement JS, décryptage JS en ligne

Comment optimiser le code JS

Objet local JavaScript

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!