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

Méthode de simulation JS pour implémenter l'encapsulation

php中世界最好的语言
Libérer: 2018-04-16 14:14:09
original
1259 Les gens l'ont consulté

Cette fois, je vais vous présenter la méthode de simulation JS pour implémenter l'encapsulation. Quelles sont les précautions pour que la simulation JS implémente l'encapsulation. Ce qui suit est un cas pratique, jetons un coup d'oeil.

Préface

L'héritage consiste à utiliser une sous-classe pour hériter d'une autre classe parent, puis la sous-classe peut automatiquement avoir tous les attributs et méthodes dans la classe parent. Ce processus est appelé héritage ! Il existe de nombreuses façons d'implémenter l'héritage dans JS. Aujourd'hui, je vais vous en présenter trois.

1. Ajoutez une méthode d'extension

sur la
//声明一个父类
function Person(name){
 this.name=name;
 this.age=age;
 this.say=function(){
   alert("我叫"+this.name);
 }
}
//声明一个子类 
function Student(){
 this.no=no;
 this.study=function(){
  alert("我在学习!");
 }
}
// 通过循坏,将父类对象的所有属性和方法,全部赋给子类对象
Object.prototype.extend=function(parent){
 for(var i in parent){
   this[i].parent[i];
 }
}
var p=new Person("张三",12);
var s=new Student("1234567");
//子类对象调用这个扩展方法
s.extend()
console.log(s);
Copier après la connexion
Classe d'objet

Les principes ci-dessus pour la mise en œuvre de l'héritage :

Grâce au bouclage, tous les attributs et méthodes de l'objet de classe parent sont affectés à l'objet de sous-classe. Le point clé est la boucle for-in Même sans étendre Object, l'opération peut être implémentée via une simple boucle.

Mais il y a certains inconvénients à mettre en œuvre l'héritage de cette manière :

① Vous ne pouvez pas obtenir directement l'objet de sous-classe complet via une seule instanciation. Au lieu de cela, vous devez d'abord obtenir l'objet de classe parent et l'objet de sous-classe, puis les fusionner manuellement

 ; ②La méthode d'héritage qui étend Object sera également conservée sur l'objet de la sous-classe.

Jetons un coup d'œil à la deuxième méthode d'implémentation de l'héritage~

2. Utiliser l'héritage prototype

Avant d'introduire cette méthode, parlons de deux notions : objet prototype et prototype

1. prototype : l'objet prototype de la fonction

①Seules les fonctions ont des prototypes, et toutes les fonctions doivent avoir un prototype

②Le prototype lui-même est aussi un objet !

③Le prototype pointe vers l'adresse de référence où se trouve la fonction actuelle !

2. proto : Le prototype de l'objet !

①Seuls les objets ont un proto, et tous les objets doivent avoir un proto

② le proto est aussi un objet, il a donc aussi son propre proto. L'ordre de recherche le long de cette ligne est la chaîne de prototypes.

③ Les fonctions et les tableaux sont tous deux des objets et ont leur propre proto

//声明父类
function Person(name,age){
   this.name=name;
   this.age=age;
   this.say=function(){
    alert("我叫"+this.name);
   }
}
//声明子类   
function Student(no){
   this.no=no;
   this.study=function(){
    alert("我在学习!我叫"+this.name+"今年"+this.age");
   }
}
//将父类对象赋给子类的prototype  
Student.prototype=new Person("张三",14);
//拿到子类对象时,就会将父类对象的所有属性和方法,添加到proto
var s=new Student(); 
s.study();
Copier après la connexion

Le principe d'utilisation de l'héritage prototypique :

Attribuez l'objet de classe parent au prototype de la sous-classe, puis les attributs et méthodes de l'objet de classe parent apparaîtront dans le prototype de la sous-classe. Ensuite, lors de l'instanciation d'une sous-classe, le prototype de la sous-classe sera dans le proto de l'objet sous-classe. Enfin, les attributs et méthodes de l'objet classe parent apparaîtront dans le proto de l'objet sous-classe.

Caractéristiques de cet héritage :

① Tous les attributs de la sous-classe elle-même sont des attributs membres et les attributs hérités de la classe parent sont des attributs prototypes.

② Impossible d'obtenir l'objet de sous-classe terminé via une instanciation en une étape.

La troisième façon de mettre en œuvre l'héritage :

call(), apply() et bind(), ces trois méthodes sont très similaires, seulement différentes par le passage des paramètres.

function Person(name,age){
  this.name=name;
  this.age=age;
  this.say=function(){
    alert("我叫"+this.name);
    }
}
function Student(no,name,age){
  this.no=no;
  this.study=function(){
    alert("我在学习!");
  }
//将父类函数的this,指向为子类函数的this
Person.call(this,name,age);
}
var s=new Student(12,"张三",24);
console.log(s);
Copier après la connexion

La seule différence entre les trois fonctions est la façon dont elles acceptent la liste des paramètres de func. A part cela, il n'y a aucune différence de fonctionnalité !

Comment écrire les trois fonctions (différences) :

Méthode d'écriture d'appel : func.call (obj pointé par this de func, paramètre func 1, paramètre func 2,...) ; Appliquer la méthode d'écriture : func.apply(obj pointé par ceci de func, [paramètre func 1, paramètre func 2,...]

); Comment écrire bind : func.bind(obj pointé par ceci de func)(paramètre func 1, paramètre func 2,...);

Je crois que vous maîtrisez la méthode après avoir lu le cas dans ce article. Veuillez prêter attention aux choses plus excitantes. D'autres articles connexes sur le site Web chinois de php !

Lecture recommandée :



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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!