JavaScript ist objektbasiert und jedes Element kann als Objekt betrachtet werden. Allerdings sind Typen und Objekte unterschiedlich. In diesem Artikel besprechen wir nicht nur einige Merkmale von Typen und Objekten, sondern untersuchen vor allem auch, wie man gute und wiederverwendbare Typen schreibt. Denn wenn JavaScript, eine beliebte Skriptsprache, gut gekapselt werden kann und eine riesige Typbibliothek bilden kann, ist es für die Wiederverwendung sehr sinnvoll.
Es gibt viele Artikel über Prototypen im Internet, aber ich habe die Kernidee nie verstanden. Nachdem ich eine Menge Beispielcode geschrieben hatte, wurde mir schließlich klar: Prototypen können nur für Typen verwendet werden.
Im Folgenden finden Sie einige Beispiele zu Typen und Objekten. Nachdem Sie die Beispiele gelesen haben, fällt es Ihnen möglicherweise leichter, die Verbindung zwischen Typen und Objekten zu verstehen:
| Beispielcode | veranschaulichen | |
| 1 | Object.prototype.Property = 1; Object.prototype.Method = function (){ alarm(1);}var obj = new Object();alert(obj.Property);obj.Method(); | Sie können Proptotypen für Typen verwenden, um dem Typ Verhalten hinzuzufügen. Diese Verhaltensweisen können nur bei Instanzen dieses Typs auftreten. Die in JS zulässigen Typen sind Array, Boolean, Date, Enumerator, Error, Function, Number, Object, RegExp, String |
| 2 | var obj = neues Objekt(); obj.prototype.Property = 1;//Error//Errorobj.prototype.Method = function(){ alarm(1);} | Sie können den Prototyp nicht für eine Instanz verwenden, da andernfalls ein Kompilierungsfehler auftritt. |
| 3 | Object.Property = 1;Object.Method = function(){ alarm(1);}alert(Object.Property);Object.Method(); | Sie können „statische“ Eigenschaften und Methoden für einen Typ definieren und diese direkt für den Typ aufrufen. |
| 4 | Object.Property = 1;Object.Method = function(){ alarm(1);}var obj = new Object();alert(obj.Property);//Errorobj.Method();//Error | Eine Instanz kann keine statischen Eigenschaften oder Methoden eines Typs aufrufen, andernfalls tritt ein Objekt-undefinierter Fehler auf. |
| 5 | function Aclass(){this.Property = 1;this.Method = function(){ alarm(1);}}var obj = new Aclass();alert(obj.Property);obj.Method(); | Dieses Beispiel zeigt die übliche Art, einen Typ in JavaScript zu definieren |
| 6 | function Aclass(){this.Property = 1;this.Method = function(){ Alert(1);}}Aclass.prototype.Property2 = 2;Aclass.prototype.Method2 = function{ Alert(2);}var obj = new Aclass();alert(obj.Property2);obj.Method2(); | Prototypen können extern verwendet werden, um benutzerdefinierten Typen Eigenschaften und Methoden hinzuzufügen. |
| 7 | function Aclass(){this.Property = 1;this.Method = function(){ Alert(1);}}Aclass.prototype.Property = 2;Aclass.prototype.Method = function{ Alert(2);}var obj = new Aclass();alert(obj.Property);obj.Method(); | Die Eigenschaften oder Methoden eines benutzerdefinierten Typs können nicht extern über den Prototyp geändert werden. Wie Sie an diesem Beispiel sehen können: Die aufgerufenen Eigenschaften und Methoden sind immer noch Ergebnisse der ursprünglichen Definition. |
| 8 | function Aclass(){this.Property = 1;this.Method = function(){ Alert(1);}}var obj = new Aclass();obj.Property = 2;obj.Method = function(){ Alert( 2);}alert(obj.Property);obj.Method(); | Eigenschaften können für Objekte geändert werden. (Das ist sicher) Sie können auch Methoden für das Objekt ändern. (Unterschied vom üblichen objektorientierten Konzept) |
| 9 | function Aclass(){this.Property = 1;this.Method = function(){ alarm(1);}}var obj = new Aclass();obj.Property2 = 2;obj.Method2 = function(){ alarm( 2);}alert(obj.Property2);obj.Method2(); | Sie können Objekten Eigenschaften oder Methoden hinzufügen |
| 10 | function AClass(){ this.Property = 1; this.Method = function() { alarm(1 }}function AClass2(){ this.Property2 = 2; }}AClass2.prototype = new AClass();var obj = new AClass2();alert(obj.Property);obj.Method();alert(obj.Property2);obj.Method2(); | Dieses Beispiel veranschaulicht, wie ein Typ von einem anderen Typ erbt. |
| 11 | function AClass(){ this.Property = 1; this.Method = function() { alarm(1 }}function AClass2(){ this.Property2 = 2; }}AClass2.prototype = new AClass();AClass2.prototype.Property = 3;AClass2.prototype.Method = function(){ alarm(4);}var obj = new AClass2();alert(obj.Property);obj.Method(); | Dieses Beispiel veranschaulicht, wie eine Unterklasse die Eigenschaften oder Methoden einer übergeordneten Klasse überschreiben kann. |
・Beispiel 2: Einschränkungen bei der Verwendung von Prototypen
・Beispiel 3: So definieren Sie statische Elemente für einen Typ
・Beispiel 7: Prototypeinschränkungen für Mitglieder neu definierter Typen
・Beispiel 10: So erben Sie einen Typ von einem anderen Typ
・Beispiel 11: So definieren Sie Mitglieder der übergeordneten Klasse in der Unterklasse neu
Zu den objektorientierten Funktionen, die JavaScript implementieren kann, gehören:
・Öffentlicher Bereich
・Öffentliche Methode
・Privates Feld
・Private Methode (privates Feld)
・Methodenüberladung
・Konstrukteur
·Ereignis
・Einzelvererbung
・Unterklasse überschreibt die Attribute oder Methoden der übergeordneten Klasse (Überschreibung)
・Statische Eigenschaften oder Methoden (statisches Mitglied)