L'héritage en js peut être divisé en deux types : l'usurpation d'identité d'objet et le chaînage de prototypes.
1. L'usurpation d'identité d'objet comprend trois types : la méthode d'attribut temporaire, la méthode call() et apply()
1. Méthode d'attribut temporaire
Copiez le code comme suit :
fonction Personne(nom){
this.name = nom ;
this.say = fonction(){
alert('Je m'appelle '+this.name);
}
}
fonction F2E(nom,id){
this.temp = Personne ;
this.temp(nom);
supprimez ce .temp ;
this.id = identifiant;
this.showId = fonction(){
alert('Bonjour, Monsieur, Mon numéro de travail est '+this.id);
}
}
var simon = new F2E('Simon',9527);
simon.say();
simon.showId();
Méthode 2.call()/apply()
Essentiellement, cela change le pointeur de ce pointeur.
Copiez le code comme suit :
fonction Personne(nom){
this.name = nom ;
this.say = fonction(){
alert('Je m'appelle '+this.name);
}
}
fonction F2E(nom,id){
Person.call(this,name); //apply() méthode modifiée en Person.apply(this,new Array(name));
this.id = identifiant;
this.showId = fonction(){
alert('Bonjour, Monsieur, Mon numéro de travail est '+this.id);
}
}
var simon = new F2E('Simon',9527);
simon.say();
simon.showId();
Inconvénients : regardons d’abord ce diagramme d’allocation de mémoire :
Dans le concept OO, après l'instanciation de new, l'objet forme son propre espace dans la mémoire tas. Il convient de noter que ce segment de code. Les méthodes membres existent dans ce segment de code et les méthodes sont partagées. Le problème est ici. Lors de l'héritage via l'usurpation d'identité d'objet, toutes les méthodes membres le soulignent, c'est-à-dire qu'après new, chaque instance aura cette méthode membre, qui n'est pas partagée, ce qui entraîne une grande quantité de gaspillage de mémoire. Et grâce à l'usurpation d'identité d'objet, les variables et méthodes définies via le prototype ne peuvent pas être héritées. Par exemple, le code suivant provoquera une erreur :
Copiez le code comme suit :
fonction Personne(nom){
this.name = nom ;
this.say = fonction(){
alert('Je m'appelle '+this.name);
}
}
Personne.prototype.age = 20 ;
Person.prototype.sayAge = function(){alert('Mon âge est '+this.age)};
fonction F2E(nom,id){
Person.apply(this,new Array(name));
this.id = identifiant;
this.showId = fonction(){
alert('Bonjour, Monsieur, Mon numéro de travail est '+this.id);
}
}
var simon = new F2E('Simon',9527);
simon.sayAge(); //Prompt TypeError : simon.sayAge n'est pas une fonction
2. Méthode de chaîne de prototypes
Copiez le code comme suit :
fonction Personne(){
this.name = 'Simon';
}
Personne.prototype.say = fonction(){
alert('Je m'appelle '+this.name);
}
fonction F2E(id){
this.id = identifiant;
this.showId = fonction(){
alert('Bonjour, Monsieur, Mon numéro de travail est '+this.id);
}
}
F2E.prototype = new Person();
var simon = nouveau F2E(9527);
simon.say();
simon.showId();
alert(simon.hasOwnProperty('id')); //Vérifie s'il s'agit de sa propre propriété
Ensuite, suivez l'exemple ci-dessus pour comprendre les concepts de chaîne de prototypes js suivants :
La chaîne de prototypes peut être comprise comme : chaque objet dans js a un attribut __proto__ caché. L'attribut __proto__ d'un objet instancié pointe vers la méthode prototype de sa classe, et cette méthode prototype peut être affectée à un autre objet d'instanciation, le __proto__ de. cet objet doit pointer vers sa classe, formant ainsi une chaîne, qui est la
Copiez le code comme suit :
F2E.prototype = nouvelle personne()
Cette phrase est la clé. Lorsqu'un objet js lit un certain attribut, il recherchera d'abord ses propres attributs. S'il n'y a pas d'attributs, il recherchera ensuite les attributs de l'objet sur la chaîne prototype. En d'autres termes, les méthodes de la chaîne de prototypes peuvent être partagées, ce qui résout le problème de l'usurpation d'identité d'objet et du gaspillage de mémoire.
Parlons maintenant des inconvénients :
L'inconvénient est évident. L'héritage de chaîne de prototype signifie que les paramètres ne peuvent pas être transmis à la classe parent lors de l'instanciation d'une sous-classe. C'est pourquoi la fonction Person() dans cet exemple n'a pas de paramètres et est directement écrite sous la forme this.name="Simon". Le code suivant n'obtiendra pas l'effet souhaité :
Copiez le code comme suit :
fonction Personne(nom){
this.name = nom ;
}
Personne.prototype.say = fonction(){
alert('Je m'appelle '+this.name);
}
fonction F2E(nom,id){
this.id = identifiant;
this.showId = fonction(){
alert('Bonjour, Monsieur, Mon numéro de travail est '+this.id);
}
}
F2E.prototype = new Person();
var simon = new F2E("Simon",9527);
simon.say();
simon.showId();
fonction Personne(nom){
this.name = nom ;
}
Personne.prototype.say = fonction(){
alert('Je m'appelle '+this.name);
}
fonction F2E(nom,id){
this.id = identifiant;
this.showId = fonction(){
alert('Bonjour, Monsieur, Mon numéro de travail est '+this.id);
}
}
F2E.prototype = new Person(); //La valeur ne peut pas être transmise ici, ni this.name ni name ne fonctionneront. Il est possible d'écrire directement F2E.prototype = new Person('wood'), mais dans ce cas, Simon. say( ) devient Mon nom est bois
var simon = new F2E("Simon",9527);
simon.say(); //Pop up Mon nom n'est pas défini
simon.showId();
Enfin, permettez-moi de résumer ce que je pense être une meilleure façon d'implémenter l'héritage. Les variables membres utilisent l'usurpation d'identité d'objet et les méthodes membres utilisent le chaînage de prototypes. Le code est le suivant :
Copiez le code comme suit :
fonction Personne(nom){
this.name = nom ;
}
Personne.prototype.say = fonction(){
alert('Je m'appelle '+this.name);
}
fonction F2E(nom,id){
Personne.call(ce,nom);
this.id = identifiant;
}
F2E.prototype = new Person();
// Notez un détail ici, showId ne peut pas être écrit devant F2E.prototype = new Person();
F2E.prototype.showId = fonction(){
alert('Bonjour, Monsieur, Mon numéro de travail est '+this.id);
}
var simon = new F2E("Simon",9527);
simon.say();
simon.showId();