Heim  >  Artikel  >  Web-Frontend  >  Zusammenfassung der Methoden zum Definieren von Klassen in JavaScript_Grundkenntnisse

Zusammenfassung der Methoden zum Definieren von Klassen in JavaScript_Grundkenntnisse

WBOY
WBOYOriginal
2016-05-16 16:23:571106Durchsuche

Es gibt viele Möglichkeiten, Klassen in JS zu definieren:

1. Fabrikmethode

Code kopieren Der Code lautet wie folgt:

Funktion Car(){
var ocar = neues Objekt;
ocar.color = "blau"; ocar.doors = 4;
ocar.showColor = function(){
Document.write(this.color)
};
Rückkehr ocar;
}
var car1 = Car();
var car2 = Car();

Beim Aufruf dieser Funktion wird ein neues Objekt erstellt und ihm werden alle Eigenschaften und Methoden zugewiesen. Verwenden Sie diese Funktion, um zwei Objekte mit genau den gleichen Eigenschaften zu erstellen. Natürlich kann meine Schwester diese Methode ändern, indem sie ihr Parameter übergibt.

Code kopieren Der Code lautet wie folgt:
Funktion Auto(Farbe,Tür){
var ocar = neues Objekt;
ocar.color = Farbe;
ocar.doors = Tür;
ocar.showColor = function(){
Document.write(this.color)
};
Rückkehr ocar;
}
var car1 = Car("red",4
). var car2 = Car("blue",4
). car1.showColor() //output:"red"
car2.showColor() //output:"blue"

Jetzt können Sie Objekte mit unterschiedlichen Werten erhalten, indem Sie unterschiedliche Parameter an die Funktion übergeben.

Im vorherigen Beispiel wird showcolor() jedes Mal erstellt, wenn die Funktion Car() aufgerufen wird, was bedeutet, dass jedes Objekt seine eigene showcolor()-Methode hat.

Aber tatsächlich hat jedes Objekt die gleiche Funktion.

Es ist zwar möglich, eine Methode außerhalb einer Funktion zu definieren und dann die Eigenschaften der Funktion auf die Methode zu verweisen.

Code kopieren Der Code lautet wie folgt:
Funktion showColor(){
alarm(this.color);
}
Funktion Car(){
var ocar = new Object();
ocar.color = Farbe;
ocar.doors = Tür;
ocar.showColor = showColor;
Rückkehr ocar;
}

Aber das sieht nicht nach einer Funktionsmethode aus.


2. Konstruktormethode
Die Konstruktormethode ist genauso einfach wie die Factory-Methode, wie unten gezeigt:

Code kopieren Der Code lautet wie folgt:
Funktion Auto (Farbe, Tür)

Sie können sehen, dass die Konstruktormethode kein Objekt innerhalb der Funktion erstellt, sondern das Schlüsselwort this verwendet. Denn das Objekt wurde beim Aufruf des Konstruktors erstellt und nur über dieses kann auf die Objekteigenschaften innerhalb der Funktion zugegriffen werden.

Verwenden Sie nun new, um Objekte zu erstellen. Es sieht so aus! Aber es ist dasselbe wie der Fabrikansatz. Jeder Aufruf erstellt eine eigene Methode für das Objekt.

3. Prototypenmethode

Diese Methode verwendet das Prototypattribut des Objekts. Zuerst wird der Klassenname mit einer leeren Funktion erstellt, dann wird allen Eigenschaften und Methoden das Prototyp-Attribut zugewiesen.

Code kopieren Der Code lautet wie folgt:
Funktion Car()

In diesem Code wird zunächst eine leere Funktion definiert und dann werden die Eigenschaften des Objekts über das Prototypattribut definiert. Beim Aufruf dieser Funktion werden alle Eigenschaften des Prototyps sofort dem zu erstellenden Objekt zugewiesen. Alle Objekte dieser Funktion speichern Zeiger auf showColor() und scheinen syntaktisch alle zum selben Objekt zu gehören.

Diese Funktion verfügt jedoch über keine Parameter und die Eigenschaften können nicht durch Übergabe von Parametern initialisiert werden. Der Standardwert der Eigenschaften muss nach der Erstellung des Objekts geändert werden.
Ein sehr ernstes Problem bei der Prototyp-Methode besteht darin, dass die Eigenschaft auf ein Objekt verweist, beispielsweise auf ein Array.

Code kopieren Der Code lautet wie folgt:

Funktion Car(){
}
Car.prototype.color = "red"; Car.prototype.doors = 4;
Car.prototype.arr = neues Array("a",b"); Car.prototype.showColor = function(){
alarm(this.color);
}
var car1 = neues Auto();
var car2 = neues Auto(); car1.arr.push("cc"); alarm(car1.arr); //output:aa,bb,cc
Alert(car2.arr); //output:aa,bb,cc



Aufgrund des Referenzwerts des Arrays verweisen die beiden Objekte von Car auf dasselbe Array. Wenn der Wert also zu car1 hinzugefügt wird, ist er auch in car2 sichtbar.
Union ist eine Methode, die wie andere Programmiersprachen die Konstruktor-/Prototypmethode zum Erstellen von Objekten verwendet. Sie verwendet den Konstruktor zum Definieren der nichtfunktionalen Attribute des Objekts und die Prototypmethode zum Definieren des Objekts.


Code kopieren

Der Code lautet wie folgt: Funktion Auto(Farbe,Tür){ This.color = Farbe;
This.doors = Tür;
This.arr = new Array("aa","bb"); }
Car.prototype.showColor(){
alarm(this.color);
}
var car1 = neues Auto("red",4); var car2 = neues Auto("blue",4); car1.arr.push("cc"); alarm(car1.arr); //output:aa,bb,cc
Alert(car2.arr); //output:aa,bb




4. Dynamische Prototypenmethode


Das Prinzip der dynamischen Prototyp-Methode ähnelt dem der gemischten Konstruktor-/Prototyp-Methode. Der einzige Unterschied besteht darin, wo die Objektmethoden zugewiesen werden.

Code kopieren

Der Code lautet wie folgt:

Funktion Auto(Farbe,Tür){ This.color = Farbe; This.doors = Tür; This.arr = new Array("aa","bb"); If(typeof Car._initialized == "undefiniert"){ Car.prototype.showColor = function(){ alarm(this.color);
};
Car._initialized = true;
}
}



Die dynamische Prototypmethode verwendet ein Flag, um zu bestimmen, ob dem Prototyp eine Methode zugewiesen wurde. Dadurch wird sichergestellt, dass die Methode nur einmal erstellt wird



6. Mischfabrikmethode

Sein Zweck besteht darin, einen gefälschten Konstruktor zu erstellen, der lediglich eine neue Instanz eines anderen Objekts zurückgibt.


Code kopieren

Der Code lautet wie folgt:

Funktion Car(){ var ocar = new Object(); ocar.color = "rot"; ocar.doors = 4; ocar.showColor = function(){ alarm(this.color) }; Rückkehr ocar;
}



Der Unterschied zur Factory-Methode besteht darin, dass diese Methode den neuen Operator verwendet.

PS (persönliches Verständnis):

1) Die von einer Klasse durch den Prototyp definierten Mitglieder (Methoden oder Attribute) sind für jedes Klassenobjekt gleich und werden im Allgemeinen nicht zum Definieren von Mitgliedsattributen verwendet. Wenn ein Objekt den Attributwert ändert, werden alle Objekte geändert >
2) Klassen haben Prototypattribute, Klassenobjekte jedoch nicht;
3) Jedes Mal, wenn ein neues Klassenobjekt oder eine Klasse direkt aufgerufen wird (in Form einer Factory-Methode unten), wird die Anweisung, die die Klasse (Funktion) definiert, einmal ausgeführt (der Singleton-Modus kann diese Situation vermeiden);
4) Klassen sind vom Funktionstyp, Klassenobjekte sind vom Objekttyp und nur Funktionstypen haben Prototypattribute

5) Die durch den Prototyp definierte Methode kann nicht auf die privaten Variablen der Klasse (von der Klasse definierte lokale Variablen) zugreifen, kann jedoch dadurch auf die Mitgliedseigenschaften und Mitgliedsmethoden der Klasse (durch diese definierte Variablen und Methoden) zugreifen.

6) So definieren Sie eine Klasse:

a. Factory-Methode (Objekt)

b. Vererbungsmethode (Prototyp)

c. Konstruktormethode (dies)

 d. Mischmethode

7) [Frage] Warum können durch Prototypen definierte Eigenschaften von jedem Objekt geändert werden? Und die in der Konstruktormethode definierten Eigenschaften gehören nur zum Objekt und haben keinen Einfluss auf die Eigenschaftswerte anderer Objekte?

Die oben genannten Methoden sind alle Methoden zum Erstellen von Objekten. Die derzeit am weitesten verbreitete Methode ist die gemischte Konstruktor-/Prototyp-Methode. Darüber hinaus erfreut sich auch die dynamische Prototyp-Methode großer Beliebtheit. Funktional äquivalent zum Konstruktor/Prototyp-Ansatz.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn