Explication détaillée de la création de classes et des objets en Javascript

Il existe de nombreuses façons de créer des classes et des objets en utilisant Javascript. Listons-les maintenant : 1. Méthode de création originale, 2. Modèle de méthode d'usine, 3. Méthode de construction modèle, 4. Méthode de prototype dynamique. Examinons en détail les exemples ci-dessous

Nous allons maintenant résumer plusieurs façons de créer des classes et des objets en Javascript :

1. Méthode de création originale :

<script type="text/javascript">
  var person = new Object();
  person.name="Amy";
  person.sex="Woman";
  person.show=function(){
    document.write("name is: "+this.name+" ; sex is:"+this.sex);
  }
  person.show(); 
</script>

. La méthode de création originale est difficile à accepter pour les personnes familiarisées avec Orienté objet. Ils ont toujours l'impression que l'encapsulation des attributs et méthodes n'est pas très serrée. basé sur la méthode "nom de l'objet" + ". ", indiquant que les propriétés et méthodes qui suivent le nom de l'objet sont des éléments appartenant à cet objet (par exemple : personne) est le résultat encapsulé. Vous pouvez continuer à ajouter des méthodes et des propriétés. , par exemple, ajoutez l'attribut age : person.age= 23;Cette méthode de création mettra les personnes familiarisées avec laprogrammation Java mal à l'aise. Nous pouvons "encapsuler" davantage la méthode de création d'origine, veuillez consulter l'étape suivante :

2. Modèle de méthode d'usine :

 <script type="text/javascript">
   function personFactory(name,age,sex){
     var ob=new Object();
     ob.name=name;
     ob.age=age;
     ob.sex=sex;
     ob.show=function(){
       document.write(ob.name+" "+ob.age+" "+ob.sex);
     }
     return ob;
   }
   var person=personFactory("Amy",21,"Woman");
   person.show();
 </script>

Le modèle de méthode d'usine ressemble plus à une classe personFactory encapsule. la méthode de création d'origine et renvoie l'objet créé à la personneréférencevariable. La personne peut alors référencer l'objet créé, mais ce n'est pas encore parfait : à chaque fois que vous créez un objet. et utilisez l'objet pour appeler la méthode show(), une nouvelle fonction show() sera créée. Ils peuvent appeler la même méthode show, méthode d'optimisation. Le show est placé en dehors de l'usine, comme. suit :

 <script type="text/javascript">
   function show(){
     document.write(this.name+" "+this.age+" "+this.sex);
   }
   function personFactory(name,age,sex){
     var ob=new Object();
     ob.name=name;
     ob.age=age;
     ob.sex=sex;
     ob.show=show;
     return ob;
   }
   var person=personFactory("Amy",22,"Woman");
   person.show();
 </script>

Fonctionnellement parlant, le code ci-dessus résout le problème de la réutilisation des fonctions, mais la méthode de présentation n'est pas comme créer un objet, et les personnes familiarisées avec Java se sentent toujours mal à l'aise. Veuillez consulter l'étape suivante :

3. Modèle de constructeur :

 <script type="text/javascript">
   function person(name,age,sex){
     this.name=name;
     this.age=age;
     this.sex=sex;
     this.show=function(){
       document.write(this.name+" "+this.age+" "+this.sex);
       document.write("<br>");
     }
   }
   var per=new person("Amy",22,"Woman");
   per.show();
 </script>

La méthode de création du code ci-dessus est presque la même que la méthode de création des classes et des objets Java. Les propriétés de la classe sont encapsulées, puis utilisez le mot-clé new pour créer et renvoyer un objet. N'est-ce pas le processus de création de classes et d'objets en Java ? Oui, c'est ce processus, mais il peut également être optimisé. L'objet ainsi créé sera instantané lors de l'appel de la méthode show. Pour créer une fonction show indépendamment, peut-on créer une méthode commune à tous les objets ? Tout comme la méthode static dans les classes Java, tous les objets utilisent la même méthode statique, et la réponse est oui. Veuillez consulter l'étape suivante :

4. Méthode de prototype dynamique :

 <script type="text/javascript">
   function Person(name,age,sex){
     this.name=name;
     this.age=age;
     this.sex=sex;
     if(typeof Person.tag == "undefined"){
       Person.prototype.show=function(){
         document.write(this.name+" "+this.age+" "+this.sex);
         document.write("<br>");
       }
       Person.tag=true;
     }
   }
   var per=new Person("Peter",22,"Man");
   per.show();
 </script>

Une petite astuce est utilisée ici Lorsque new est utilisé pour créer un objet. Le bloc de fonction Person sera exécuté. L'instruction de jugement if dans l'ordre est de haut en bas. Bien sûr, la variable tag n'est pas définie au début, donc le contenu du bloc d'instruction if est exécuté :

Person.prototype.show=function(){
 document.write(this.name+" "+this.age+" "+this.sex);
 document.write("<br>");
 }

La signification de ce contenu est Créer une méthode show appartenant à la classe Person. Notez qu'il s'agit d'une méthode de classe, qui est équivalente à la méthode statique modifiée en Java, plutôt qu'une méthode unique. object De cette façon, tous les objets peuvent appeler la même méthode, et il n'est pas nécessaire de le faire. Ne serait-il pas préférable de créer votre propre fonction show lors de l'appel de méthodes sur différents objets, ce qui permet non seulement d'économiser de l'espace mais également du temps ? Laissez-moi vous expliquer ici, les propriétés et méthodes construites dans la méthode "nom de classe.prototype.property/method" sont équivalentes aux variables ou méthodes modifiées avec static en Java. Elles appartiennent à la classe entière, pas à un seul objet, c'est-à-dire. , tous les objets sont partagés.

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!