Heim > Artikel > Web-Frontend > Klassenimplementierung in Javascript
Javascript selbst unterstützt keine Objektorientierung, es verfügt über keine Zugriffskontrollzeichen, es verfügt nicht über das Schlüsselwort class zum Definieren einer Klasse, es unterstützt weder Extend noch Doppelpunkt für die Vererbung und es verwendet Virtual nicht zur Unterstützung von Virtual Da Javascript jedoch eine flexible Sprache ist, schauen wir uns an, wie Javascript ohne das Schlüsselwort class die Klassendefinition implementiert und Objekte erstellt.
1: Definieren Sie eine Klasse und erstellen Sie ein Instanzobjekt der Klasse
In Javascript verwenden wir eine Funktion, um eine Klasse wie folgt zu definieren:
function Shape()
{
var x=1;
var y=2;
}
Sie mögen sagen, Zweifel? Ist das nicht eine definierende Funktion? Ja, das ist eine Definitionsfunktion. Wir definieren eine Formfunktion und initialisieren x und y. Wenn Sie es jedoch aus einem anderen Blickwinkel betrachten, definieren Sie eine Shape-Klasse mit zwei Attributen x und y, und die Anfangswerte sind 1 bzw. 2. Das Schlüsselwort, das wir zum Definieren verwenden Klasse ist Funktion statt Klasse.
Dann können wir ein Objekt aShape der Shape-Klasse wie folgt erstellen:
var aShape = new Shape();
Zwei: Definieren Sie public und private Eigenschaften
Wir haben ein aShape-Objekt erstellt, aber wenn wir versuchen, auf seine Eigenschaften zuzugreifen, tritt ein Fehler wie folgt auf:
aShape.x=1;
Dies zeigt, dass mit var definierte Attribute ist privat. Wir müssen das Schlüsselwort this verwenden, um die öffentlichen Attribute
function Shape()
{
this.x=1;
this.y=2;
}
aShape.x=2;
{
var x=0;
var y=1;
this.draw=function()
{
//print;
};
}
aShape.draw();
{
var x=0;
var y=1;
var draw=function()
{
//print;
};
}
Auf diese Weise können Sie aShape.draw nicht zum Aufrufen dieser Funktion verwenden.
3: Konstruktor
Javascript unterstützt kein OOP, und natürlich gibt es keinen Konstruktor. Wir können jedoch selbst einen Konstruktor simulieren und ihn automatisch aufrufen lassen, wenn das Objekt vorhanden ist Der Code lautet wie folgt:function Shape()
{
var init = function()
{
;
}
Am Ende von Shape haben wir die Funktion init künstlich aufgerufen. Wenn dann ein Shape-Objekt erstellt wird, wird init immer automatisch aufgerufen und unser Konstruktor kann simuliert werden.
Viertens: Konstruktor mit Parametern
{
var x=0;
var y =0;
{
//Konstruktorfunktion
x=ax;
y=ay;
};
init( );
}
var aShape = new Shape(0,1);
Fünf: Statische Eigenschaften und statische Methoden
Wie definiere ich statische Eigenschaften und Methoden in Javascript? Wie unten gezeigt
{
var x=0;
var y=0;
{
Dieses Attribut gehört zur Klasse , nicht das Objekt.
Shape.staticMethod=function(){};//Definieren Sie eine statische Methode
Mit statischen Eigenschaften und Methoden können wir wie folgt über den Klassennamen darauf zugreifen
alert ( aShape.count );
aShape.staticMethod();
Hinweis: Statische Eigenschaften und Methoden Sie sind Alles öffentlich. Bisher weiß ich nicht, wie ich statische Eigenschaften und Methoden privat machen kann >Greifen Sie in der Klassenmethode auf Ihre eigenen Eigenschaften zu. Schauen Sie sich den Code unten an.
var x=0;
var y=0;this.gx=0;
this.gy=0; var init = function()
{
x= ax;//Zugriff Private Eigenschaften, schreiben Sie einfach den Variablennamen direkt
y=ay;
this.gx=ax;//Um auf öffentliche Eigenschaften zuzugreifen, müssen Sie this.
vor dem Variablennamen this.gy =ay hinzufügen ;
};
init();
}
Sieben: Hinweise dazu
Nach der Erfahrung des Autors weist dies in der Klasse nicht immer auf The hin Der Hauptgrund für unser Objekt selbst ist, dass Javascript keine OOP-Sprache ist und Funktionen und Klassen mit Funktionen definiert werden, was natürlich einige kleinere Probleme verursachen wird.
Die Situation, in der dieser Zeiger auf einen Fehler hinweist, liegt normalerweise in der Ereignisverarbeitung vor. Wir möchten, dass die Mitgliedsfunktion auf ein Ereignis reagiert this Der Zeiger ist nicht mehr unser eigenes Objekt. Der Aufruf dieser Funktion in der Member-Funktion führt natürlich zu einem Fehler.
Lassen Sie uns den Code ändern, um dieses Problem zu lösen. Vergleichen Sie den Code in Teil 6, Sie werden
function Shape(ax,ay)
var _this=this; //Speichern Sie dies und verwenden Sie _this, um dies in Zukunft wie folgt zu ersetzen Dann wird Sie das nicht verwirren
var x=0;
var y=0;
_this.gx=0;
_this.gy=0;
var init = function ( )
{
x=ax;//Um auf private Attribute zuzugreifen, schreiben Sie einfach den Variablennamen direkt
y=ay;
_this.gx=ax;//Um auf öffentliche Attribute zuzugreifen, Sie muss vor dem Variablennamen stehen. Fügen Sie dies hinzu.
_this.gy=ay;
};
init();
}
Oben haben wir darüber gesprochen wie man in Javascript Klassen definiert, Objekte von Klassen erstellt, öffentliche und private Eigenschaften und Methoden erstellt, statische Eigenschaften und Methoden erstellt, Konstruktoren verspottet und die Fehleranfälligkeit diskutiert.
Das ist alles, was wir über die OOP-Implementierung in Javascript sagen. Das Obige ist der praktischste Inhalt. Im Allgemeinen wird Javascript zum Definieren von Klassen verwendet und der obige Code reicht aus, um Objekte zu erstellen. Natürlich können Sie auch Mootools oder Prototypen verwenden, um Klassen zu definieren und Objekte zu erstellen. Ich habe das Mootools-Framework verwendet und finde es sehr gut. Es verfügt über eine umfassendere Javascript-Klassensimulation und unterstützt die Klassenvererbung. Wenn Sie ein Framework verwenden, müssen Sie natürlich die relevanten js-Header-Dateien in Ihre Webseite einbinden, daher hoffe ich immer noch, dass Leser Klassen ohne Framework erstellen können. Auf diese Weise ist der Code effizienter, und Sie können dies auch tun Sehen Sie, es ist nicht mühsam, eine einfache Klasse zu erstellen ~
Das Obige ist das Inhalt der Klassenimplementierung in Javascript. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!