Es gibt viele Möglichkeiten, Klassen in JS zu definieren:
1. Factory-Methode
function Car(){ var ocar = new Object; ocar.color = "blue"; ocar.doors = 4; ocar.showColor = function(){ document.write(this.color) }; return ocar; } var car1 = Car(); var car2 = Car();
Wenn diese Funktion aufgerufen wird, werden ein neues Objekt und alle Attribute und Methoden erstellt wird ihm gegeben . 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.
function Car(color,door){ var ocar = new Object; ocar.color = color; ocar.doors = door; ocar.showColor = function(){ document.write(this.color) }; return 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 muss showcolor() jedes Mal erstellt werden, 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.
Obwohl es möglich ist, eine Methode außerhalb einer Funktion zu definieren und dann die Attribute der Funktion auf die Methode zu verweisen.
function showColor(){ alert(this.color); } function Car(){ var ocar = new Object(); ocar.color = color; ocar.doors = door; ocar.showColor = showColor; return ocar; }
Aber das sieht nicht nach einer Funktionsmethode aus.
2. Konstruktor--Methode
Die Konstruktor-Methode ist genauso einfach wie die Factory-Methode, wie unten gezeigt:
function Car(color,door){ this.color = color; this.doors = door; this.showColor = function(){ alert(this.color) }; } var car1 = new Car("red",4); var car2 = new Car("blue",4);
Sie können sehen, dass die Konstruktor-Methode kein < hat 🎜> innerhalb der Funktion verwenden Sie das Schlüsselwort this, um ein Objekt zu erstellen. Denn das Objekt wurde beim Aufruf des Konstruktors erstellt und nur über dieses kann auf die Objekteigenschaften innerhalb der Funktion zugegriffen werden. Verwenden Sie jetzt „Neu“, 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. Prototyp-Methode
Diese Methode verwendet das Prototyp-Attribut des Objekts. Zuerst wird der Klassenname mit einer leeren Funktion erstellt, dann wird allen Eigenschaften und Methoden das Prototyp-Attribut zugewiesen.
function Car(){ } Car.prototype.color = "red"; Car.prototype.doors = 4; Car.prototype.showColor = function(){ alert(this.color); } var car1 = new Car(); var car2 = new Car();
Diese Funktion hat jedoch keine Parameter. Sie können Eigenschaften nicht durch Übergabe von Parametern initialisieren. Sie müssen den Standardwert der Eigenschaft ändern, nachdem das Objekt erstellt wurde.
Ein sehr ernstes Problem bei der Prototyp-Methode besteht darin, dass die Eigenschaft auf ein Objekt verweist, beispielsweise auf ein Array.
function Car(){ } Car.prototype.color = "red"; Car.prototype.doors = 4; Car.prototype.arr = new Array("a","b"); Car.prototype.showColor = function(){ alert(this.color); } var car1 = new Car(); var car2 = new Car(); car1.arr.push("cc"); alert(car1.arr); //output:aa,bb,cc alert(car2.arr); //output:aa,bb,cc
Referenzwerts des Arrays auf dasselbe Array. Wenn der Wert also zu car1 hinzugefügt wird, ist er auch in zu sehen Auto2. Union ist eine Methode, die wie andere Programmiersprachen Konstruktor-/Prototypmethoden verwendet, um Objekte zu erstellen. Sie verwendet Konstruktoren, um nichtfunktionale Attribute von Objekten zu definieren, und Prototypmethoden, um Objekte zu definieren.
function Car(color,door){ this.color = color; this.doors = door; this.arr = new Array("aa","bb"); } Car.prototype.showColor(){ alert(this.color); } var car1 = new Car("red",4); var car2 = new Car("blue",4); car1.arr.push("cc"); alert(car1.arr); //output:aa,bb,cc alert(car2.arr); //output:aa,bb
Das Prinzip der dynamischen Prototyp-Methode ähnelt der gemischten Konstruktor/Prototyp-Methode. Der einzige Unterschied besteht darin, wo die Objektmethoden zugewiesen werden.
function Car(color,door){ this.color = color; this.doors = door; this.arr = new Array("aa","bb"); if(typeof Car._initialized == "undefined"){ Car.prototype.showColor = function(){ alert(this.color); }; Car._initialized = true; } }
6. Gemischte Factory-Methode
Ihr Zweck besteht darin, einen gefälschten Konstruktor zu erstellen und nur eine neue Instanz eines anderen Objekts zurückzugeben.
function Car(){ var ocar = new Object(); ocar.color = "red"; ocar.doors = 4; ocar.showColor = function(){ alert(this.color) }; return ocar; }
Operator verwendet. 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.
Erklärung der grundlegenden Syntax und Variablen von JavaScript
Erklärung einiger grundlegender und häufig verwendeter Methoden in js
Detaillierte Antworten zur grundlegenden js-Syntax
Das obige ist der detaillierte Inhalt vonErläuterung der Methoden zum Definieren von Klassen in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!