Maison > interface Web > js tutoriel > le corps du texte

Explication détaillée du prototype javascript (cours de base)

亚连
Libérer: 2018-05-19 13:49:25
original
1580 Les gens l'ont consulté

Le prototype est un concept particulièrement important en JavaScript et doit être maîtrisé. Sans une bonne compréhension, il est fondamentalement impossible de bien utiliser ou apprendre JS. De plus, ce concept est légèrement difficile, ce qui peut être difficile pour les nouveaux utilisateurs. un peu difficile pour les amis qui le connaissent. Présentons brièvement l'utilisation du prototype prototype à travers des exemples de code

Une brève introduction au prototype prototype de javascript :
Le prototype prototype est un concept particulièrement important dans javascript et doit être maîtrisé. , sans une bonne compréhension, il est fondamentalement impossible d'utiliser ou d'apprendre correctement js, et ce concept est légèrement difficile, ce qui peut être un peu difficile pour les amis qui sont nouveaux. Présentons brièvement le prototype. à travers des exemples de code. Utilisation de prototypes.

1. Concepts de base :

Chaque fonction possède un attribut de prototype.
Cet attribut est un pointeur qui peut pointer vers un objet, et cet objet sera partagé par l'instance d'objet créée par le constructeur, c'est-à-dire que cet objet sera hérité.
Résumé : L'objet pointé par prototype est partagé par les instances d'objet créées par le constructeur.
L'instance d'objet créée a une propriété interne [[Prototype]], qui est un pointeur vers l'objet pointé par le prototype du constructeur (prototype).
Regardez d'abord un morceau de code :

<script>
function antzone(name,age){
 this.webname=name;
 this.age=age;
}
antzone.prototype.getName=function(){
 return this.webname;
}
var oantzone=new antzone("PHP中文网",10);
console.log(oantzone.getName());
</script>
Copier après la connexion

2. Exemple de code :
Exemple 1 :

function antzone(name,age){
 this.webname=name;
 this.age=age;
}
var obj={
 address:"江苏省徐州"
}
var oantzone=new antzone("PHP中文网",10);
antzone.prototype=obj;
console.log(oantzone.address);
Copier après la connexion

En regardant le code ci-dessus, de nombreux amis peuvent penser que la valeur de sortie est "Xuzhou, province du Jiangsu", mais le contenu réel de la sortie n'est pas défini car lors de l'utilisation du. constructeur pour créer l'objet oantzone, l'objet oantzone La propriété interne [[Prototype]] pointera vers l'objet pointé par le prototype du constructeur antzone() Plus tard, antzone.prototype=obj est le prototype du constructeur de réinitialisation. , et la propriété intégrée [[Prototype]] de oantzone pointe toujours vers C'est l'objet d'origine, donc naturellement oantzone.address n'est pas défini.
Exemple 2 :

<script>
function antzone(name,age){
 this.webname=name;
 this.age=age;
}
var obj={
 address:"江苏省徐州"
}
antzone.prototype=obj;
var oantzone=new antzone("PHP中文网",10);
console.log(oantzone.webname+oantzone.address);
</script>
Copier après la connexion

La seule différence entre ce code et le code précédent réside dans les huitième et neuvième lignes. les lignes sont échangées afin que « Xuzhou, province du Jiangsu » puisse être affiché. Ce n'est pas difficile à comprendre, car l'instance d'objet est créée après la réinitialisation du prototype.
Exemple 3 :

function antzone(name,age){
 this.webname=name;
 this.age=age;
}
var obj={
 address:"江苏省徐州"
}
antzone.prototype.add=obj;
var oantzone=new antzone("PHP中文网",10);
console.log(oantzone.add.address);
Copier après la connexion

Le code ci-dessus modifie uniquement le prototype de l'objet, plutôt que de réinitialiser le prototype de l'objet.

Ce qui précède est ce que j'ai compilé pour vous. J'espère que cela vous sera utile à l'avenir.

Articles associés :

À propos des appels simples pour obtenir des données JSON en JS (le code est joint, simple et brut)

Détails Présentation de l'utilisation des expressions EL dans JS

Vidéo d'entrée de gamme.jsNotes d'utilisation (code joint)

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal