1. Héritage d'objets dans js
Il existe trois méthodes d'héritage dans js
Le prototype 1.js (prototype) implémente l'héritage
Copiez le code comme suit :
<SPAN style="COULEUR DE FOND : #ffffff"><SPAN style="FONT-SIZE : 18px"><html>
<corps>
<script type="text/javascript">
fonction Personne (nom, âge) {
this.name=nom;
this.age=âge;
}
Person.prototype.sayHello=fonction(){
alert("Utilisez le prototype pour obtenir Nom : "+this.name);
}
var per=nouvelle personne("Ma Xiaoqian",21);
per.sayHello(); //Sortie : utilisez le prototype pour obtenir Nom : Ma Xiaoqian
fonction Étudiant(){}
Student.prototype=new Person("Hong Rutong",21);
var stu=nouvel étudiant();
Étudiant.prototype.grade=5 ;
Student.prototype.intr=fonction(){
alerte (this.grade);
}
stu.sayHello();//Sortie : utilisez le prototype pour obtenir Nom : Hong Rutong
stu.intr();//Sortie : 5
</script>
</corps>
</html></SPAN></SPAN>
2. Le constructeur implémente l'héritage
Copiez le code comme suit :
<SPAN style="FONT-SIZE : 18px"><html>
<corps>
<script type="text/javascript">
fonction Parent(nom){
this.name=nom;
this.sayParent=fonction(){
alert("Parent:"+this.name);
}
}
function Enfant (nom, âge) {
this.tempMethod=Parent ;
this.tempMethod(nom);
this.age=âge;
this.sayChild=fonction(){
alert("Enfant :"+this.name+"age:"+this.age);
}
}
var parent=nouveau Parent("Jiang Jianchen");
parent.sayParent(); //Sortie : "Parent : Jiang Jianchen"
var child=new Child("李明",24); //Sortie : "Child:李明age:24"
enfant.sayChild();
</script>
</corps>
</html></SPAN>
3.call, appliquer pour implémenter l'héritage
Copiez le code comme suit :
<SPAN style="FONT-SIZE : 18px"><html>
<corps>
<script type="text/javascript">
fonction Personne (nom, âge, amour) {
this.name=nom;
this.age=âge;
this.love=amour;
this.say=fonction say(){
alert("Nom:"+nom);
}
}
//appel de la méthode
fonction étudiant(nom,âge){
Person.call(ce,nom,âge);
}
//appliquer la méthode
fonction professeur(nom,amour){
Person.apply(this,[nom,amour]);
//Person.apply(this,arguments); //Même effet que la phrase précédente, arguments
}
// Similitudes et différences entre call et aply :
//1, le premier paramètre est le même, il fait référence à l'objet courant
//2, le deuxième paramètre est différent : call est une liste de paramètres un par un ; apply est un tableau (des arguments peuvent également être utilisés)
var per=new Person("Wufenglou",25,"Wei Yingping"); //Sortie : "Wufenglou"
par.say();
var stu=nouvel étudiant("Cao Yu",18);//Sortie : "Cao Yu"
stu.say();
var tea=new professeur("Qin Jie",16);//Sortie : "Qin Jie"
thé.say();
</script>
</corps>
</html></SPAN>
2. Utilisation de l'appel et de la candidature (introduction détaillée)
Call et apply dans js peuvent implémenter l'héritage. La seule différence de paramètre est que la méthode d'écriture apply correspondant à func.call(func1,var1,var2,var3) est : func.apply(func1,[var1,var2,var3]) .
L'explication de l'appel dans le manuel JS :
Copiez le code comme suit :
<SPAN style="FONT-SIZE: 18px">méthode d'appel
Appelez une méthode sur un objet pour remplacer l'objet actuel par un autre objet.
appel([thisObj[,arg1[, arg2[, [,.argN]]]]])
paramètre
cetObj
Facultatif. L'objet qui sera utilisé comme objet actuel.
arg1, arg2, , argN
Facultatif. Une séquence de paramètres de méthode sera transmise.
illustrer
La méthode call peut être utilisée pour appeler une méthode au nom d’un autre objet. La méthode d'appel modifie le contexte d'objet d'une fonction du contexte initial au nouvel objet spécifié par thisObj.
Si le paramètre thisObj n'est pas fourni, l'objet Global est utilisé comme thisObj. </SPAN>
Pour faire simple, la fonction de ces deux fonctions est en fait de changer le pointeur interne de l'objet, c'est-à-dire de changer le contenu pointé par celui-ci de l'objet. Ceci est parfois utile dans la programmation js orientée objet. Prenons apply comme exemple pour parler du rôle important de ces deux fonctions dans js. comme:
Copiez le code comme suit :
<SPAN style="FONT-SIZE: 18px"> function Person(name,age){ //Définir une classe
this.name=nom; //nom
this.age=âge; //Âge
this.sayhello=function(){alert(this.name)};
}
function Print(){ //Afficher les attributs de la classe
this.funcName="Imprimer" ;
this.show=fonction(){
var msg=[];
for(clé var dans ceci){
if(typeof(this[key])!="function"){
msg.push([clé,":",this[clé]].join(""));
}
}
alert(msg.join(" "));
} ;
}
function Student(name,age,grade,school){ //Classe d'étudiant
Person.apply(this,arguments); // Avantages par rapport à l'appel
Print.apply(this,arguments);
this.grade=grade; //Note
this.school=école; //école
}
var p1=nouvelle personne("Bu Kaihua",80);
p1.sayhello();
var s1=nouvel étudiant("Bai Yunfei",40,9,"Académie Yuelu");
s1.show();
s1.sayhello();
alerte(s1.funcName);</SPAN>
De plus, Function.apply() joue un rôle de premier plan dans l'amélioration des performances du programme :
Commençons par la fonction Math.max(). Math.max peut être suivi de n'importe quel nombre de paramètres, et renvoie enfin la valeur maximale parmi tous les paramètres.
Par exemple
Copiez le code comme suit :
<SPAN style="FONT-SIZE: 18px">alerte(Math.max(5,8));
alerte(Math.max(5,7,9,3,1,6)); //9
//Mais dans de nombreux cas, nous devons trouver le plus grand élément du tableau.
vararr=[5,7,9,1];
//alerte(Math.max(arr)); // Cela ne fonctionne pas. NaN
//Écris-le comme ça
fonction getMax(arr){
var arrLen=arr.longueur;
pour(var i=0,ret=arr[0];i<arrLen;i++){
ret=Math.max(ret,arr[i]);
}
retour à la retraite;
}
alerte(getMax(arr)); //9
// Basculez pour postuler, vous pouvez écrire comme ça
fonction getMax2(arr){
return Math.max.apply(null,arr);
}
alerte(getMax2(arr)); //9
//Les deux morceaux de code atteignent le même objectif, mais getMax2 est élégant, efficace et beaucoup plus concis.
//Un autre exemple est la méthode push du tableau.
vararr1=[1,3,4];
vararr2=[3,4,5];
//Si nous voulons développer arr2, ajoutez ensuite à arr1 un par un, et enfin laissez arr1=[1,3,4,3,4,5]
//arr1.push(arr2) ne fonctionne évidemment pas. Parce que faire cela obtiendra [1,3,4,[3,4,5]]
//Nous ne pouvons utiliser qu'une boucle pour pousser un par un (bien sûr, vous pouvez également utiliser arr1.concat(arr2), mais la méthode concat ne change pas arr1 elle-même)
var arrLen=arr2.longueur;
pour(var i=0;i<arrLen;i++){
arr1.push(arr2[i]);
}
//Depuis l'introduction d'Apply, les choses sont devenues si simples
Array.prototype.push.apply(arr1,arr2); //Maintenant, arr1 est le résultat souhaité</SPAN>