Le concept de l'héritage JS
Les deux méthodes d'héritage suivantes couramment utilisées dans JS:
Héritage de la chaîne prototype (héritage entre objets)
Héritage classique (héritage entre les constructeurs)
Étant donné que JS n'est pas un langage vraiment orienté objet comme Java, JS est basé sur des objets et il n'a aucun concept de classes. Par conséquent, si vous souhaitez mettre en œuvre un héritage, vous pouvez utiliser le prototype de mécanisme de prototype de JS ou utiliser les méthodes d'application et d'appel pour l'implémenter
Dans une langue orientée objet, nous utilisons des classes pour créer un objet personnalisé. Cependant, tout dans JS est un objet, alors quelle méthode peut être utilisée pour créer un objet personnalisé? Cela nécessite le prototype JS:
Nous pouvons simplement considérer le prototype comme un modèle. Les objets personnalisés nouvellement créés sont une copie de ce modèle (prototype) (en fait pas une copie mais un lien, mais ce type de lien est invisible. Il y a un pointeur __proto__ invisible à l'intérieur de l'objet nouvellement instancié, pointant vers l'objet Prototype).
JS peut simuler et implémenter les fonctions des classes via des constructeurs et des prototypes. De plus, la mise en œuvre de l'héritage de type JS est également réalisée en s'appuyant sur des chaînes prototypes.
Héritage prototype et héritage de classe
L'héritage classique est l'appel d'un constructeur de supertype à l'intérieur du constructeur du sous-type.
L'héritage strict n'est pas très courant et est généralement utilisé en combinaison:
La copie de code est la suivante:
fonction super () {
this.colors = ["rouge", "bleu"];
}
fonction sub () {
Super.Call (ceci);
}
L'héritage prototype consiste à créer un nouvel objet à l'aide d'objets existants et à pointer le prototype de la sous-classe à la classe parent, ce qui équivaut à l'ajout de la chaîne prototype de la classe parent.
Héritage de la chaîne prototype
Pour qu'une classe enfant hérite des propriétés de la classe parent (y compris les méthodes), un constructeur est d'abord nécessaire pour définir. Ensuite, affectez une nouvelle instance de la classe parent au prototype du constructeur. Le code est le suivant:
La copie de code est la suivante:
<cript>
fonction parent () {
this.name = 'Mike';
}
fonction child () {
this.age = 12;
}
Child.prototype = new Parent (); // Child hérite du parent et forme une chaîne à travers le prototype.
Var test = new Child ();
alerte (test.age);
alert (test.name); // obtenir des attributs hérités
// continue de hériter de la chaîne prototype
fonction frère () {// Brother Construct
this.weight = 60;
}
Brother.prototype = new Child (); // Continue à un héritage de la chaîne prototype
var frère = nouveau frère ();
alert (frère.name); // hériter le parent et l'enfant, Mike apparaît
alert (frère.age); // pop 12
</cript>
L'héritage de la chaîne prototype ci-dessus manque toujours un lien, c'est-à-dire un objet, et tous les constructeurs sont hérités de l'objet. L'objet héritant est automatiquement terminé et ne nécessite pas de l'héritage manuel par nous-mêmes. Alors, quelle est leur relation subordonnée?
Déterminez la relation entre le prototype et l'instance
Il existe deux façons de déterminer la relation entre un prototype et une instance. Instance d'opérateur OFF et ISPrototypeOf () Méthodes:
La copie de code est la suivante:
alerte (frère de frère objet) // vrai
alerte (tester l'instance de frère); // false, le test est la superclasse de frère
alerte (instance frère de l'enfant); // vrai
alerte (instance frère de parent); // vrai
Tant qu'il s'agit d'un prototype qui apparaît dans la chaîne prototype, il peut être considéré comme le prototype de l'instance dérivée de la chaîne prototype. Par conséquent, la méthode isPrototypeOf () renvoie également vrai.
Dans JS, la fonction héritée est appelée supertype (classe parent, classe de base et également) et la fonction héritée est appelée sous-type (sous-classe, classe dérivée). L'utilisation de l'héritage prototype implique principalement deux problèmes:
Premièrement, la réécriture littérale des prototypes brisera la relation, utilisera le prototype du type de référence et le sous-type ne peut pas transmettre des paramètres au supertype.
La pseudo-classe résout le problème du partage de référence et les supertypes incapables de passer des arguments. Nous pouvons utiliser la technologie "Emprunter Constructor".
Constructeur d'emprunt (héritage classique)
La copie de code est la suivante:
<cript>
fonction parent (âge) {
this.name = [«Mike», «Jack», «Smith»];
this.age = âge;
}
fonction enfant (âge) {
Parent.Call (ce, âge);
}
Var test = nouveau enfant (21);
alerte (test.age); // 21
alert (test.name); // Mike, Jack, Smith
test.name.push ('bill');
alert (test.name); // Mike, Jack, Smith, Bill
</cript>
Bien que les constructeurs d'emprunt aient résolu les deux problèmes tout à l'heure, sans prototypes, il n'y a aucun moyen de réutiliser, nous avons donc besoin d'un motif de constructeur de chaîne prototype + emprunter. Ce modèle est appelé héritage combiné.
Héritage combiné
La copie de code est la suivante:
<cript>
fonction parent (âge) {
this.name = [«Mike», «Jack», «Smith»];
this.age = âge;
}
Parent.prototype.run = function () {
retourne this.name + 'sont les deux' + this.age;
};
fonction enfant (âge) {
Parent.Call (This, Age); // objet imite et transmet les paramètres aux supertypes
}
Child.prototype = nouveau parent (); // héritage de la chaîne prototype
Var Test = New Child (21); // Écriture de nouveaux parents (21) est OK
alert (test.run ()); // Mike, Jack, Smith sont les deux21
</cript>
L'héritage combiné est une méthode d'héritage relativement couramment utilisée. L'idée derrière elle est d'utiliser la chaîne prototype pour mettre en œuvre l'héritage des propriétés et des méthodes prototypes, et pour implémenter l'héritage des propriétés d'instance en empruntant les constructeurs. De cette façon, le multiplexage des fonctions est réalisé en définissant des méthodes sur le prototype et en s'assurant que chaque instance a ses propres propriétés.
Utilisation de Call (): appelez une méthode d'un objet et remplacez l'objet actuel par un autre objet.
La copie de code est la suivante:
appel ([thisObj [, arg1 [, arg2 [, [, .argn]]]]))
Héritage prototype
Cette façon d'hériter de la création de nouveaux objets basés sur des objets existants sans créer de types personnalisés est appelé prototype héritage
La copie de code est la suivante:
<cript>
fonction obj (o) {
fonction f () {}
F.prototype = o;
retourner nouveau f ();
}
var box = {
Nom: «Trigkit4»,
Arr: [«frère», «sœur», «Baba»]
};
var b1 = obj (box);
alerte (b1.name); // Trigkit4
b1.name = 'Mike';
alerte (b1.name); // mike
alerte (b1.arr); // frère, sœur, baba
b1.arr.push («parents»);
alerte (b1.arr); // frère, sœur, baba, parents
var b2 = obj (boîte);
alerte (b2.Name); // Trigkit4
alerte (b2.arr); // frère, sœur, baba, parents
</cript>
L'héritage du prototype crée d'abord un constructeur temporaire à l'intérieur de la fonction OBJ (), puis utilise l'objet passé comme prototype du constructeur et renvoie enfin une nouvelle instance de ce type temporaire.
Héritage parasite
Cette méthode d'héritage combine le modèle Prototype + Factory, dans le but du processus de création d'encapsulation.
La copie de code est la suivante:
<cript>
fonction create (o) {
var f = obj (o);
f.run = fonction () {
Renvoyez ceci.arr; // De même, les références seront partagées
};
retour f;
}
</cript>
Petits problèmes avec l'héritage combiné
L'héritage combiné est le mode d'héritage le plus couramment utilisé dans JS, mais le supertype de l'héritage combiné sera appelé deux fois pendant l'utilisation; Une fois, c'est lors de la création d'un sous-type, et l'autre se trouve à l'intérieur du constructeur de sous-type.
La copie de code est la suivante:
<cript>
fonction parent (name) {
this.name = name;
this.arr = [«frère», «sœur», «parents»];
}
Parent.prototype.run = function () {
Renvoie ce.name;
};
fonction enfant (nom, âge) {
Parent.Call (ce, âge); // le deuxième appel
this.age = âge;
}
Child.prototype = new Parent (); // le premier appel
</cript>
Le code ci-dessus est l'héritage de la combinaison précédente, donc l'héritage de la combinaison parasite résout le problème de deux appels.
Héritage de combinaison parasite
La copie de code est la suivante:
<cript>
fonction obj (o) {
fonction f () {}
F.prototype = o;
retourner nouveau f ();
}
function create (parent, test) {
var f = obj (parent.prototype); // créer un objet
F.Constructor = Test; // Objet amélioré
}
fonction parent (name) {
this.name = name;
this.arr = [«frère», «sœur», «parents»];
}
Parent.prototype.run = function () {
Renvoie ce.name;
};
fonction enfant (nom, âge) {
Parent.Call (ceci, nom);
this.age = âge;
}
héritageprototype (parent, enfant); // L'héritage est réalisé ici
Var test = new Child ('Trigkit4', 21);
test.arr.push («neveu»);
alerte (test.arr); //
alert (test.run ()); // seule la méthode est partagée
var test2 = new Child ('Jack', 22);
alerte (test2.arr); // résoudre le problème de citation
</cript>
appeler et postuler
Les fonctions globales s'appliquent et l'appel peut être utilisé pour modifier le pointage de cela dans la fonction, comme suit:
La copie de code est la suivante:
// définir une fonction globale
fonction foo () {
console.log (this.fruit);
}
// définir une variable globale
var fruit = "pomme";
// Personnalisez un objet
var pack = {
Fruit: "orange"
};
// équivalent à Window.foo ();
foo.apply (fenêtre); // "Apple", c'est égal à la fenêtre
// ce === pack à foo
foo.apply (pack); // "orange"