2. JavaScript-objektorientierte Programmierung: Vererbung von Konstruktoren
In diesem Abschnitt wird hauptsächlich eingeführt, wie eine Instanz generiert wird, die mehrere Objekte "erbt".
Zum Beispiel gibt es jetzt einen Konstruktor für ein "Tier" -Objekt.
Funktion Animal () {this.species = "Animal"; }Es gibt auch einen "Katzen" -Objektkonstruktor,
Funktion cat (Name, Farbe) {this.name = name; this.color = color; }Wie können "Katzen" "Tiere" erben?
1. Konstruktorenbindung
Der einfachste Weg ist wahrscheinlich, den Aufruf zu verwenden oder die Methode anzuwenden, um den Konstruktor des übergeordneten Objekts an das untergeordnete Objekt zu binden, dh eine Zeile zum Konstruktor des untergeordneten Objekts hinzuzufügen:
Funktion cat (Name, Farbe) {Animal.Apply (this, Argumente); this.name = name; this.color = color; } var cat1 = neue Katze ("Big Hair", "Yellow"); Alert (Cat1.Species); // Tier2. Prototypmodus
Ein häufigerer Ansatz ist die Verwendung des Prototyp -Attributs.
Wenn das Prototypobjekt von "Katze" auf eine Instanz von Tier zeigt, können alle Instanzen von "Katze" ein Tier erben.
Cat.Prototype = new Animal (); Cat.Prototype.Constructor = cat; var cat1 = neue Katze ("Big Hair", "Yellow"); Alert (Cat1.Species); // TierIn der ersten Zeile des Codes weisen wir das CAT -Prototyp -Objekt auf eine Instanz von Tier hin.
1.Cat.Prototype = new Animal ();
Es ist gleichwertig, den ursprünglichen Wert des Prototyp -Objekts vollständig zu entfernen und dann einen neuen Wert zuzuweisen. Aber was bedeutet die zweite Zeile?
1.Cat.Prototype.Constructor = cat;
Es stellt sich heraus, dass jedes Prototypobjekt über ein Konstruktorattribut auf seine Konstruktorfunktion hinweist. Mit anderen Worten, die Konstruktoreigenschaft des Cat.Prototyps zeigt auf CAT.
Wir haben den ursprünglichen Wert dieses Prototyp -Objekts im vorherigen Schritt gelöscht, sodass das neue Prototyp -Objekt nicht über das Konstruktorattribut verfügt, sodass wir es manuell hinzufügen müssen, da es ansonsten Probleme mit der nachfolgenden "Vererbungskette" geben wird. Das bedeutet die zweite Zeile.
Kurz gesagt, dies ist ein sehr wichtiger Punkt, und Sie müssen ihm beim Programmieren folgen. Alle folgenden folgenden folgenden: Wenn das Prototypobjekt ersetzt wird, wird ersetzt,
1.O.Prototype = {};
Anschließend muss der nächste Schritt darin bestehen, das Konstruktorattribut zum neuen Prototyp -Objekt hinzuzufügen und dieses Attribut wieder auf die ursprüngliche Konstruktorfunktion zu verweisen.
1.O.Prototype.Constructor = O;
3.. Erben Sie den Prototyp direkt
Da in Tierobjekten unveränderte Eigenschaften direkt an Animal.Prototyp geschrieben werden können. Daher können wir auch Cat () überspringen lassen und Animal () überspringen und Tier.Prototyp direkt erben.
Lassen Sie uns nun zuerst das Tierobjekt umschreiben:
1. Function Animal () {}
2.Animal.Prototype.Species = "Animal";
Zeigen Sie dann das Prototypobjekt der Katze und verweisen Sie auf das Prototypobjekt des Tieres, damit die Vererbung abgeschlossen ist.
Cat.Prototype = Animal.Prototyp; Catcat.Prototype.Constructor = cat; var cat1 = neue Katze ("Big Hair", "Yellow"); Alert (Cat1.Species); // TiereIm Vergleich zu der ersteren Methode ist der Vorteil, dass es relativ effizient ist (keine tierischen Instanzen auszuführen und zu erstellen) und mehr Speichersparung. Der Nachteil ist, dass Cat.Prototype und Animal.Prototyp nun auf dasselbe Objekt verweisen, sodass jede Änderung zu Cat.Prototype in Animal.Prototype spiegelt.
Der obige Code ist also tatsächlich problematisch. Bitte beachten Sie die zweite Zeile
1.Cat.Prototype.Constructor = cat;
Dieser Satz hat tatsächlich das Konstruktorattribut des Tieres geändert.
1.Alert (Animal.Prototype.Constructor); // Katze
4. Verwenden Sie leere Objekte als Vermittler
Da "Direkter Vererbung des Prototyps" die oben genannten Nachteile hat, kann ein leeres Objekt als Vermittler verwendet werden.
var f = function () {}; F.Prototype = Animal.Prototyp; Cat.Prototype = new f (); Cat.Prototype.Constructor = cat;F ist ein leeres Objekt, so dass es fast kein Gedächtnis besetzt. Zu diesem Zeitpunkt beeinflusst das Ändern des CAT -Prototyp -Objekts nicht das Tierprototypobjekt.
1.Alert (Animal.Prototype.Constructor); // Tier
5. Kapselungsfunktion des Prototypmodus
Wir umfassen die obige Methode in eine Funktion zur einfachen Verwendung.
Funktion erweitert (untergeordnet, übergeordnet) {var f = function () {}; F.Prototype = parent.prototype; Child.Prototype = new f (); Child.Prototype.Constructor = Child; Child.uber = parent.prototype; }Bei der Verwendung lautet die Methode wie folgt
erweitern (Katze, Tier); var cat1 = neue Katze ("Big Hair", "Yellow"); Alert (Cat1.Species); // TierDiese Erweiterungsfunktion ist die Methode, wie die Yui -Bibliothek die Vererbung implementiert.
Lassen Sie es mich auch erklären. Die letzte Linie des Funktionskörpers
1.Child.uber = parent.prototype;
Es bedeutet, ein Uber -Attribut für das untergeordnete Objekt festzulegen, das direkt auf das Prototyp -Attribut des übergeordneten Objekts hinweist. Dies entspricht dem Öffnen eines Kanals im untergeordneten Objekt und dem direkten Aufruf der Methode des übergeordneten Objekts. Diese Linie wird hier platziert, nur um die Vollständigkeit der Vererbung zu erreichen, und ist nur eine Ersatzeigenschaft.
6. Erbschaftskopie
Das obige ist die Verwendung von Prototypobjekten zur Implementierung der Vererbung. Wir können auch unser Denken ändern und die "Kopier" -Methode verwenden, um die Vererbung zu erreichen. Einfach ausgedrückt, wenn alle Eigenschaften und Methoden des übergeordneten Objekts in das untergeordnete Objekt kopiert werden, kann nicht die Vererbung erreicht werden?
Setzen Sie zunächst alle unveränderten Eigenschaften des Tieres auf sein Prototypobjekt.
1. Function Animal () {}
2.Animal.Prototype.Species = "Animal";
Schreiben Sie dann eine andere Funktion, um den Zweck des Kopierens von Eigenschaften zu erreichen.
Funktion extend2 (untergeordnet, übergeordnet) {var p = parent.prototype; var c = child.Prototyp; für (var i in p) {c [i] = p [i]; } C.uber = p; }Die Funktion dieser Funktion besteht darin, die Eigenschaften im Prototypobjekt des übergeordneten Objekts auf das Prototypobjekt des untergeordneten Objekts einzeln zu kopieren.
Schreiben Sie bei der Verwendung Folgendes:
Extend2 (Katze, Tier); var cat1 = neue Katze ("Big Hair", "Yellow"); Alert (Cat1.Species); // TierDie obige Artikel-Depth-Analyse der objektorientierten Programmierung in JavaScript ist der gesamte Inhalt, den ich mit Ihnen teile. Ich hoffe, es kann Ihnen eine Referenz geben und ich hoffe, Sie können Wulin.com mehr unterstützen.