Fünf Möglichkeiten zur Implementierung der Vererbung in js

Ausleihen von Konstruktoren

Die Grundidee dieser Technik ist einfach: Rufen Sie den Supertyp-Konstruktor innerhalb des Subtyp-Konstruktors auf. Außerdem ist eine Funktion nichts anderes als ein Objekt, das Code in einer bestimmten Umgebung ausführt. Mithilfe der Methoden apply() und call() können Sie den Konstruktor also auch auf einem neu erstellten Objekt ausführen.

Funktion Box(Name){
 dieser.name = Name
}
Box.prototype.age = 18

Funktion Schreibtisch(Name){
 Box.call (this, name) // Objekt-Impersonation, Objekt-Impersonation kann nur Informationen im Konstruktor erben}

var Schreibtisch = neuer Schreibtisch('ccc')
console.log(desk.name) // --> ccc
console.log(desk.age) // --> undefiniert

Daraus können wir ersehen, dass nur Instanzeigenschaften vererbt werden und auf die Eigenschaften des Prototyps nicht zugegriffen werden kann. Dieses Muster löst zwei Probleme: Es ermöglicht Parameterübergabe und Vererbung, kann aber ohne Prototyp nicht wiederverwendet werden.

Vererbung von Kompositionen

Funktion Box(Name){
 dieser.name = Name
}
Box.prototype.run = Funktion (){
 console.log(dieser.name + "Wird ausgeführt...")
}

Funktion Schreibtisch(Name){
 Box.call(dieser, Name) // Objekt-Identitätswechsel}

Desk.prototype = neue Box() // Prototypenkette var desk = neuer Desk('ccc')
console.log(desk.name) // --> ccc
desk.run() // --> ccc läuft...

Die Idee hinter dieser Vererbungsmethode besteht darin, die Prototypenkette zum Vererben von Prototypeigenschaften und -methoden und den Konstruktor zum Vererben von Instanzeigenschaften zu verwenden.

Prototypische Vererbung

Prototypenvererbung: Mit Prototypen können neue Objekte auf Basis vorhandener Objekte erstellt werden, ohne dass eigene Typen erstellt werden müssen. Wenn wir darüber sprechen, müssen wir eine Person erwähnen. Douglas Crockford hat in seinem Artikel „Prototype inheritance in Javascript“ aus dem Jahr 2006 eine Methode beschrieben:

function object(o) { // übergebe eine Literalfunktion function F(){} // erstelle einen Konstruktor F.prototype = o; // weise die Literalfunktion dem Prototyp des Konstruktors zu return new F() // gib abschließend den instanziierten Konstruktor zurück }

Betrachten Sie das folgende Beispiel:

Funktion obj(o) {
 Funktion F (){}
 F.Prototyp = o;
 returniere neues F()
}

var box = {
 Name: "ccc",
 Alter: 18,
 Familie: ['Bruder','Schwester']
}

var box1 = obj(box)
console.log(box1.name) // --> ccc
box1.family.push('Schwester')
console.log(box1.family) // --> ["Bruder", "Schwester", "Schwester"]

var box2 = obj(box)
console.log(box2.family) // --> ["Bruder", "Schwester", "Schwester"]

Da die Implementierungslogik des obigen Codes der Vererbung von Prototypketten sehr ähnlich ist, wird das Referenzarray, d. h. das Familienattribut, gemeinsam genutzt.

Parasitäre Vererbung

Funktion obj(o) {
 Funktion F (){}
 F.Prototyp = o;
 returniere neues F()
}
Funktion erstellen(o){
 var clone = obj(o) // Erstelle ein neues Objekt indem du eine Funktion aufrufst clone.sayName = function(){ // Erweitere dieses Objekt irgendwie console.log('hi')
 }
 return clone // Dieses Objekt zurückgeben }

var Person = {
 Name: "ccc",
 Freunde: ['aa','bb']
}

var anotherPerson = erstellen(Person)
eine anderePerson.sayName() // --> hallo

Der Code in diesem Beispiel gibt basierend auf „person“ ein neues Objekt zurück, „otherPerson“. Das neue Objekt verfügt nicht nur über alle Eigenschaften und Methoden einer Person, sondern auch über eine eigene sayHi()-Methode. Parasitäre Vererbung ist auch in Situationen ein nützliches Muster, in denen Sie sich in erster Linie mit Objekten und nicht mit benutzerdefinierten Typen und Konstruktoren befassen. Die Verwendung parasitärer Vererbung zum Hinzufügen von Funktionen zu Objekten verringert die Effizienz aufgrund der fehlenden Möglichkeit, Funktionen wiederzuverwenden, was dem Konstruktormuster ähnelt.

Parasitäre kombinatorische Vererbung

Wie bereits erwähnt, ist die zusammengesetzte Vererbung der am häufigsten verwendete Vererbungsmodus in JavaScript, hat aber auch ihre eigenen Nachteile. Das größte Problem bei der zusammengesetzten Vererbung besteht darin, dass der Supertyp-Konstruktor unter allen Umständen zweimal aufgerufen wird: einmal beim Erstellen des Subtyp-Prototyps und einmal innerhalb des Subtyp-Konstruktors. Ja, der Subtyp wird letztendlich alle Instanzeigenschaften des Supertypobjekts enthalten, aber wir müssen diese Eigenschaften beim Aufruf des Subtypkonstruktors neu schreiben. Schauen wir uns das folgende Beispiel an:

Funktion SuperType(Name){
 dieser.name = Name;
 diese.farben = ['rot','schwarz']
}
SuperType.prototype.sayName = Funktion (){
 console.log(dieser.Name)
}
Funktion SubType(Name, Alter){
 SuperType.call(this, name) // Zweiter Aufruf von SuperType
 this.age = Alter
}

SubType.prototype = new SuperType() // Erster Aufruf von SuperType
SubTyp.prototype.constructor = Untertyp
SubTyp.prototyp.sayAge = Funktion (){
 console.log(dieses.Alter)
}

Beim ersten Aufruf des SuperType-Konstruktors erhält SubType.prototype zwei Eigenschaften: Name und Farben. Sie alle sind Instanzeigenschaften von SuperType, befinden sich jetzt jedoch im Prototyp von SubType. Wenn der SubType-Konstruktor aufgerufen wird, wird der SuperType-Konstruktor erneut aufgerufen, wodurch die Namen und Farben der Instanzattribute im neuen Objekt erneut erstellt werden. Daher maskieren diese beiden Eigenschaften die beiden Eigenschaften mit demselben Namen im Prototyp. Das heißt, es gibt zwei Sätze von Namens- und Farbattributen: einen für die Instanz und einen für den Prototyp. Dies ist das Ergebnis des zweimaligen Aufrufs des SuperType-Konstruktors. Die Lösung dieses Problems ist die parasitäre Kombinationsvererbung.
Bei der sogenannten parasitären kombinatorischen Vererbung handelt es sich um die Vererbung von Eigenschaften durch die Übernahme von Konstruktoren und die Vererbung von Methoden über eine hybride Form von Prototypenketten. Die Grundidee dahinter besteht darin, dass zum Erstellen eines Prototyps eines Subtyps der Konstruktor des Supertyps nicht aufgerufen werden muss; wir benötigen lediglich eine Kopie des Prototyps des Supertyps. Im Wesentlichen verwenden Sie parasitäre Vererbung, um vom Prototyp des Supertyps zu erben und das Ergebnis dann dem Prototyp des Subtyps zuzuweisen. Das grundlegende Muster der parasitären zusammengesetzten Vererbung ist wie folgt:

Funktionsobjekt (o) {
 Funktion F (){}
 F.Prototyp = o;
 returniere neues F()
}
Funktion inheritPtototype(Untertyp, Supertyp){
 var prototype = object(superType.prototype) // Objekt erstellen prototype.constructor = subType // Objekt verbessern subType.prototype = prototype // Objekt angeben }

Funktion SuperType(Name){
 dieser.name = Name
 this.colors = ['rot', 'weiß']
}

SuperType.prototype.sayName = Funktion(){
 console.log(dieser.Name)
}

Funktion SubType(Name,Alter){
 SuperType.call(diesen,Name)
 this.age = Alter
}

inheritPtototype(Untertyp, Supertyp)

SubTyp.prototyp.sayAge = Funktion(){
 console.log(dieses.Alter)
}

var Instanz = neuer Subtyp('ccc', 18)

Instanz.sayName() // --> ccc
Instanz.sayAge() // --> 18
console.log(Instanz)

Die von der Konsole ausgedruckte Struktur:

Detailliertes Diagramm:

Die Effizienz dieses Beispiels besteht darin, dass es den SuperType-Konstruktor nur einmal aufruft und somit die Erstellung unnötiger, redundanter Eigenschaften in SubType.prototype vermeidet. Gleichzeitig bleibt die Prototypenkette unverändert; daher können instanceof und isPrototypeOf() weiterhin normal verwendet werden. Dies ist auch die Vererbungsmethode, die von vielen großen Unternehmen verwendet wird.

Oben sind die Details der fünf Methoden zur Implementierung der Vererbung in js aufgeführt. Weitere Informationen zur js-Vererbung finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!