Une brève discussion sur les trois méthodes d'héritage et leurs avantages et inconvénients dans JS

La première méthode de prototype:

 // la fonction de classe présidente personne () {this.hair = 'noir'; this.eye = 'noir'; this.skin = 'jaune'; this.view = function () {return this.hair + ',' + this.eye + ',' + this.skin; }} // fonction de sous-classe man () {this.feature = ['Beard', 'Strong']; } man.prototype = new personne (); var one = new man (); console.log (One.Feature); // ['Beard', 'Strong'] console.log (one.hair); // Black Console.log (One.Eye); // Black Console.log (One.Skin); // jaune console.log (one.view ()); // noir, noir, jaune

Cette méthode est la plus simple. Vous n'avez qu'à affecter la valeur d'attribut prototype de la sous-classe à une instance héritée, puis vous pouvez dire directement la méthode de classe héritée.

Que signifie l'attribut prototype? Le prototype est le prototype. Chaque objet (défini par la fonction) a une propriété de prototype par défaut, qui est un type d'objet.

Et cet attribut par défaut est utilisé pour implémenter la vérification de la chaîne à la chaîne. Cela signifie que si l'attribut d'un objet n'existe pas, l'attribut se trouve à travers l'objet dans lequel appartient l'attribut prototype. Et si le prototype ne peut être trouvé?

JS trouvera automatiquement l'objet auquel appartient la propriété Prototype à l'attribut Prototype, de sorte qu'il continuera d'indexer via le prototype jusqu'à ce que la propriété ou le prototype soit trouvé et enfin vide ("non défini");

Par exemple, dans la méthode one.view () dans l'exemple ci-dessus, JS cherchera d'abord s'il existe une méthode View () dans une seule instance. Parce qu'il n'y a pas, il recherche l'attribut man.prototype, et la valeur du prototype est une instance de personne.

Cette instance a une méthode View (), donc l'appel est réussi.

La deuxième façon est de s'appliquer:

 // la fonction de classe présidente personne () {this.hair = 'noir'; this.eye = 'noir'; this.skin = 'jaune'; this.view = function () {return this.hair + ',' + this.eye + ',' + this.skin; }} // fonction de sous-classe man () {// personne.Apply (this, new Array ()); personne.Apply (ceci, []); this.feture = ['Beard', 'Strong']; } var one = new man (); console.log (One.Feature); // ['Beard', 'Strong'] console.log (one.hair); // Black Console.log (One.Eye); // Black Console.log (One.Skin); // jaune console.log (one.view ()); // noir, noir, jaune

Remarque: Si le paramètre Appliquer est vide, c'est-à-dire qu'aucun paramètre n'est passé, il sera passé par nouveau Array () et [], et Null n'est pas valide.

Le troisième type est Call + Prototype:

 // la fonction de classe présidente personne () {this.hair = 'noir'; this.eye = 'noir'; this.skin = 'jaune'; this.view = function () {return this.hair + ',' + this.eye + ',' + this.skin; }} // fonction de sous-classe man () {// personne.Apply (this, new Array ()); personne.Call (ceci, []); this.feture = ['Beard', 'Strong']; } man.prototype = new personne (); var one = new man (); console.log (One.Feature); // ['Beard', 'Strong'] console.log (one.hair); // Black Console.log (One.Eye); // Black Console.log (One.Skin); // jaune console.log (one.view ()); // noir, noir, jaune

Le mécanisme de mise en œuvre de la méthode d'appel nécessite un autre man.prototype = new personne (); Pourquoi?

En effet, la méthode d'appel implémente uniquement le remplacement de la méthode et ne copie pas les attributs d'objet.

C'est ainsi que l'API Google Map hérite.

Ce qui précède résume la mise en œuvre de trois méthodes d'héritage. Mais chaque méthode présente ses avantages et ses inconvénients.

Si la classe parent est comme ceci:

 // La fonction de la classe parent (cheveux, œil, peau) {this.hair = cheveux; this.eye = œil; this.skin = peau; this.view = function () {return this.hair + ',' + this.eye + ',' + this.skin; }}

Comment les sous-classes doivent être conçues pour que l'homme de sous-classe passe par des paramètres à la personne de la classe parent lors de la création d'objets. La méthode de l'héritage du prototype n'est pas applicable.

Vous devez utiliser la méthode d'application ou d'appel:

 // Appliquer la méthode // Fonction de sous-classe homme (cheveux, œil, peau) {personne.Apply (ceci, [cheveux, œil, peau]); this.feture = ['Beard', 'Strong']; } // Méthode d'appel // Fonction de sous-classe homme (cheveux, œil, peau) {personne.Call (ceci, cheveux, œil, peau); this.feture = ['Beard', 'Strong']; }

Mais il y a encore des inconvénients à utiliser la méthode d'application. Pourquoi? Dans JS, nous avons un opérateur très important, qui est "instance", qui est utilisé pour comparer si une certaine direction opposée est d'un certain type.

Pour cet exemple, en plus d'être un type d'homme, une instance doit également être un type de personne. Cependant, après avoir hérité de la méthode d'application, on n'appartient pas au type de personne, c'est-à-dire que la valeur de (une instance de personne) est fausse.

Après tout cela, la meilleure façon d'hériter est la méthode Call + Prototype. Après cela, vous pouvez essayer si la valeur de (une instance de base de base) est vraie.

La troisième méthode d'héritage a également des défauts: lors de la sous-classe de nouveaux objets, vous devez transmettre les paramètres requis par la classe parent, et les propriétés et méthodes de la classe parent seront reproduites. La méthode d'héritage suivante est parfaite:

 fonction personne (name) {this.name = name; } Personne.prototype.getName = function () {return this.name; } fonction chinois (nom, nation) {personne.Call (ce, nom); this.Nation = Nation; } // Méthode héritée Fonction Hérite (sous-classe, superclass) {fonction f () {} f.prototype = superclass.prototype; sous-classe.prototype = new f (); sous-class.prototype.constructor = sous-class.constructor; } héritage (chinois, personne); Chinois.prototype.getNation = function () {return this.Nation; }; var p = new personne ('shijun'); var c = nouveau chinois ("liyatang", "Chine"); console.log (p); // personne {name: "shijun", getName: function} console.log (c); // chinois {nom: "liyatang", nation: "Chine", constructeur: fonction, getNation: function, getName: function} console.log (p.Constructor); // Fonction Person (name) {} console.log (c.constructor); // fonction chinois () {} console.log (c instanceof chinois); // true console.log (c instanceof personne); // vrai

L'article ci-dessus discute brièvement des trois méthodes d'héritage et de leurs avantages et inconvénients en JS. C'est tout le contenu que je partage avec vous. J'espère que vous pourrez vous faire référence et j'espère que vous pourrez soutenir Wulin.com plus.