Résumé des méthodes de définition des classes dans JavaScript_Basic knowledge

Il existe de nombreuses façons de définir des classes en JS :

1. Méthode d'usine

Copier le code Le code est le suivant :

fonction Voiture(){
var ocar = nouvel objet
ocar.color = "bleu";
ocar.doors = 4;
ocar.showColor = function(){
Document.write(this.color)
};
Retournez ocar
}
var voiture1 = Voiture();
var voiture2 = Voiture();

Lorsque cette fonction est appelée, un nouvel objet sera créé et toutes les propriétés et méthodes lui seront assignées. Utilisez cette fonction pour créer 2 objets avec exactement les mêmes propriétés. Bien entendu, ma sœur peut modifier cette méthode en lui passant des paramètres.

Copier le code Le code est le suivant :

function Car(couleur,porte){
var ocar = nouvel objet
ocar.color = couleur;
ocar.doors = porte;
ocar.showColor = function(){
Document.write(this.color)
};
Retournez ocar
}
var car1 = Voiture("rouge",4);
var car2 = Voiture("bleu",4);
car1.showColor() //sortie : "rouge"
car2.showColor() //sortie : "bleu"

Vous pouvez désormais obtenir des objets avec des valeurs différentes en passant différents paramètres à la fonction.
Dans l'exemple précédent, showcolor() est créé à chaque fois que la fonction Car() est appelée, ce qui signifie que chaque objet possède sa propre méthode showcolor().

Mais en fait, chaque objet partage la même fonction.
Bien qu'il soit possible de définir une méthode en dehors d'une fonction, puis de pointer les propriétés de la fonction vers la méthode.

Copier le code Le code est le suivant :

fonction showColor(){
alert(this.color);
}
fonction Voiture(){
var ocar = new Objet();
ocar.color = couleur;
ocar.doors = porte;
ocar.showColor = showColor;
Retournez ocar
}

Mais cela ne ressemble pas à une méthode fonctionnelle.
2. Méthode constructeur
La méthode constructeur est aussi simple que la méthode usine, comme indiqué ci-dessous :

Copier le code Le code est le suivant :

fonction Voiture (couleur, porte)

Vous pouvez voir que la méthode constructeur ne crée pas d'objet à l'intérieur de la fonction, mais utilise le mot-clé this. Parce que l'objet a été créé lorsque le constructeur est appelé, et seul celui-ci peut être utilisé pour accéder aux propriétés de l'objet à l'intérieur de la fonction.
Utilisez maintenant new pour créer des objets, cela ressemble à ceci ! Mais c'est la même chose que l'approche d'usine. Chaque appel crée sa propre méthode pour l'objet.

3. Méthode prototype

Cette méthode utilise l'attribut prototype de l'objet. Tout d'abord, le nom de la classe est créé avec une fonction vide, puis toutes les propriétés et méthodes se voient attribuer l'attribut prototype.

Copier le code Le code est le suivant :

fonction Voiture()

Dans ce code, une fonction vide est d'abord définie, puis les propriétés de l'objet sont définies via l'attribut prototype. Lorsque cette fonction est appelée, toutes les propriétés du prototype seront immédiatement affectées à l'objet à créer. Tous les objets de cette fonction stockent des pointeurs vers showColor(), et syntaxiquement, ils semblent tous appartenir au même objet.
Cependant, cette fonction n'a aucun paramètre et les propriétés ne peuvent pas être initialisées en passant des paramètres. La valeur par défaut des propriétés doit être modifiée après la création de l'objet.
Un problème sérieux avec la méthode prototype survient lorsque la propriété pointe vers un objet, tel qu'un tableau.

Copier le code Le code est le suivant :

fonction Voiture(){
}
Car.prototype.color = "rouge"
Voiture.prototype.portes = 4;
Car.prototype.arr = new Array("a","b");
Car.prototype.showColor = function(){
alert(this.color);
}
var car1 = nouvelle voiture ();
var car2 = nouvelle voiture ();
car1.arr.push("cc");
alert(car1.arr); //sortie:aa,bb,cc
alert(car2.arr); //sortie:aa,bb,cc

En raison de la valeur de référence du tableau, les deux objets de Car pointent vers le même tableau, donc lorsque la valeur est ajoutée à car1, elle peut également être vue dans car2.
Union est une méthode qui utilise la méthode constructeur/prototype pour créer des objets comme les autres langages de programmation. Elle utilise le constructeur pour définir les attributs non fonctionnels de l'objet et la méthode prototype pour définir l'objet.

Copier le code Le code est le suivant :

function Car(couleur,porte){
This.color = couleur;
This.doors = porte;
This.arr = new Array("aa","bb");
}
Car.prototype.showColor(){
alert(this.color);
}
var car1 = nouvelle voiture("rouge",4);
var car2 = nouvelle voiture("bleu",4);
car1.arr.push("cc");
alert(car1.arr); //sortie:aa,bb,cc
alert(car2.arr); //sortie:aa,bb

4. Méthode de prototype dynamique

Le principe de la méthode du prototype dynamique est similaire à celui de la méthode mixte constructeur/prototype. La seule différence réside dans l'endroit où les méthodes objet sont attribuées.

Copier le code Le code est le suivant :

function Car(couleur,porte){
This.color = couleur;
This.doors = porte;
This.arr = new Array("aa","bb");
If(typeof Car._initialized == "undefined"){
Car.prototype.showColor = function(){
alert(this.color);
};
Car._initialized = vrai;
}
>

La méthode du prototype dynamique utilise un indicateur pour déterminer si une méthode a été attribuée au prototype. Cela garantit que la méthode n'est créée qu'une seule fois

6. Méthode d'usine de mélange

Son but est de créer un faux constructeur qui renvoie simplement une nouvelle instance d'un autre objet.

Copier le code Le code est le suivant :

fonction Voiture(){
var ocar = new Objet();
ocar.color = "rouge";
ocar.doors = 4;
ocar.showColor = function(){
alerte(this.color)
};
Retournez ocar
}

La différence avec la méthode factory est que cette méthode utilise l'opérateur new.

PS (compréhension personnelle) :

1) Les membres (méthodes ou attributs) définis par une classe via un prototype sont communs à chaque objet de classe et ne sont généralement pas utilisés pour définir les attributs des membres. Si un objet modifie la valeur de l'attribut, tous les objets seront modifiés ; >

2) Les classes ont des attributs de prototype, mais pas les objets de classe

3) Chaque fois qu'un nouvel objet de classe ou une classe est appelé directement (sous la forme d'une méthode d'usine ci-dessous), l'instruction définissant la classe (fonction) sera exécutée une fois (le mode singleton peut éviter cette situation) ;

4) Les classes sont de type fonction, les objets de classe sont de type objet et seuls les types de fonctions ont des attributs prototypes ;

5) La méthode définie par prototype ne peut pas accéder aux variables privées de la classe (variables locales définies par la classe), mais peut accéder aux propriétés membres et aux méthodes membres de la classe (variables et méthodes définies par celle-ci) via ceci ;

6) Comment définir une classe :

a. Méthode usine (Objet)

b. Méthode d'héritage (prototype)

c. Méthode constructeur (this)

　d. Méthode de mélange

7) [Question] Pourquoi les propriétés définies via le prototype peuvent-elles être modifiées par n'importe quel objet ? Et les propriétés définies dans la méthode constructeur appartiennent uniquement à l'objet et n'affecteront pas les valeurs des propriétés des autres objets ?

Ci-dessus sont toutes les méthodes pour créer des objets. La méthode la plus utilisée actuellement est la méthode mixte constructeur/prototype. De plus, la méthode du prototype dynamique est également très populaire. Fonctionnellement équivalent à l’approche constructeur/prototype.