Als objektorientierte Sprache (JS ist objektbasiert) ist es wichtig, die Vererbung zu implementieren. Da es jedoch kein Konzept der Klasse selbst gibt, wird die Vererbung nicht durch Klassen wie eine echte objektorientierte Programmiersprache implementiert, kann aber die Vererbung durch andere Methoden implementieren. Es gibt viele Möglichkeiten, die Erbschaft umzusetzen, und das Folgende sind nur einige davon.
1. Prototyp -Kettenvererbung
Funktion person () {// Die ererbte Funktion wird als Supertype (übergeordnete Klasse, Basisklasse) bezeichnet. Name = 'mumu'; this.age = '18 '; } Person.Prototype.name = 'susu'; // Wenn der Attributname der gleiche ist, müssen Sie am nächsten sein, suchen Sie zuerst in der Instanz, aber gehen Sie zum Prototyp, um Funktion Worker () {// Die ererbte Funktion wird als Subtyp (Unterklasse, abgeleitete Klasse) bezeichnet.job = 'Student'; } Worker. console.log (p2.name); console.log (p2 Instanceof Objekt); // Alle Konstruktoren werden vom Objekt vererbtDer Schlüssel zur obigen Implementierung der Vererbung ist: Worker.Prototype = new Person (); Machen Sie den Arbeiterprototyp zu einer Instanz der Person und erben Sie ihn durch die Prototypkette.
Hinweis: Wenn Sie Prototyp -Ketten zur Implementierung der Vererbung verwenden, können Sie Objektliterale nicht verwenden, um Prototypmethoden zu erstellen, da dies die Beziehung unterbricht und die Prototypkette umschreibt.
Prototyp -Kettenvererbungsproblem:
1. Es gibt ein Referenzproblem, und sie teilen immer noch den gleichen Raum, und die Unterklasse wirkt sich auf die übergeordnete Klasse aus.
Funktion person () {this.bodys = ['eye', 'foot']; } function Worker () {} Worker.Prototype = new Person (); var p1 = neuer Arbeiter (); p1.bodys.push ('Hand'); var p2 = neuer Arbeiter (); console.log (p1.bodys); console.log (p2.bodys);2. Beim Erstellen von Subtyp -Instanzen können Parameter nicht in Supertyp -Konstruktoren übergeben werden.
Wie kann man also die beiden Probleme der Prototypkette lösen? Schauen Sie sich dann weiter die Erbschaftsmethode unten an ~
2. Erbschaftskonstruktor -Erbschaft (auch als Objektimitation, gefälschtes Objekt oder klassischer Vererbung genannt)
Funktionsperson (Name, Alter) {this.name = name; this.age = Alter; this.bodys = ['eye', 'foot']; } Person.Prototype.Showname = function () {console.log (this.name); } Funktionsarbeiter (Name, Alter, Job) {Person.call (this, Name, Alter); this.job = Job; // Unterklasse addattribute hinzufügen} var p1 = neuer Arbeiter ('Mumu', '18', 'Student'); p1.bodys.push ('Hand'); var p2 = neuer Arbeiter (); console.log (p1.name); console.log (p2.bodys); console.log (p1.showname ());Eine kurze Analyse des obigen Prinzips der Verwendung von geliehenen Konstruktoren: Person.Call (dieser, Name, Alter); Dieser Code ruft den übergeordneten Konstruktor auf, erbt das übergeordnete Attribut und verwendet die Aufrufmethode, um den Person -Konstruktor aufzurufen, um dies zu ändern, wenn die Funktion ausgeführt wird. Hier ist dies-> Neu ist eine verklebte Methode für Arbeiterobjektkonstruktor: Übergeben Sie den Arbeiter an die obige Person.
Wenn der Referenztyp im Konstruktor platziert ist, wird er nicht geteilt, sodass P2 nicht betroffen ist.
Das Ausleihen der Konstruktor -Vererbungsmethode hier löst das Problem, dass die Prototyp -Kette keine Parameter übergeben und Referenztypen teilen kann.
Tipps: CALL () und apply () Methoden können den Umfang der Funktionsdurchführung ändern, kurz gesagt, auf den in dieser Funktion angezeigten Inhalt ändern.
Sowohl Call () als auch anwenden () akzeptieren zwei Parameter: Der erste ist der Umfang der darin ausgeführten Funktion, und der andere ist der übergebene Parameter.
Der Unterschied zwischen Anruf und Anwendung ist der Unterschied in den Parametern.
Die Parameter im Anruf müssen nacheinander aufgezählt werden.
Die Parameter anwenden müssen Arrays oder Argumenteobjekte sein
Die Frage ist also: Warum ist das Ergebnis von p1.Showname () falsch? ---- Weil die Vererbungsmethode des Ausleihenkonstruktoren nur Attribute und Methoden im Konstruktor erben kann. Hier finden wir auch ein Problem der Ausleihekonstruktoren.
HINWEIS: Da wir alle Methoden in den Konstruktor einfügen, werden wir jedes Mal, wenn wir instanziieren, Speicherplatz für Ressourcen zuordnen, sodass wir normalerweise Methoden in den Prototyp und die Attribute im Konstruktor einfügen.
Das Erbschaftsproblem von Kreditkonstruktoren:
Da das Ausleihen eines Konstruktors nur die Eigenschaften und Methoden des Konstruktors erben kann, sind die im Supertyp -Prototyp definierten Methoden für die Unterklasse unsichtbar, so dass er keinem Prototyp entspricht. Infolgedessen können alle Methoden nur im Konstruktor definiert werden, sodass es keine Funktionsmultiplexe gibt.
Wie kann man das Problem lösen, das durch Kreditkonstruktoren verursacht wird? Dann hängt es von der folgenden Erbschaftsmethode ab
3. Kombinationsvererbung (pseudoklassische Vererbung)
Funktionsperson (Name, Alter) {this.name = name; this.age = Alter; } Person.Prototype.Showname = function () {console.log (this.name); } Funktionsarbeiter (Name, Alter, Job) {Person.call (this, Name, Alter); // liehen Sie den Konstruktor This.job = Job; } Worker.Prototype = new Person (); // Prototyp -Kette Inheritance var p1 = New Worker ('mumu', '18', 'Student'); console.log (p1.age); p1.Showname ();Kombinationsvererbung: Kombination der Prototypkette mit dem geliehenen Konstruktor.
Idee: Durch die Verwendung der Prototypkette zur Implementierung der Vererbung von Attributen und Methoden im Prototyp und durch Ausleihen des Konstruktors zur Implementierung der Vererbung von Instanzattributen
Die obige Beispielperson.Call (this, Name, Alter); leiht sich den Konstruktor zum Erben von Attributen
Worker.Prototype = new Person (); Die Prototyp -Kette erbt die Methode, vermeidet die Mängel der beiden, kombiniert ihre Vorteile und wird zum am häufigsten verwendeten Vererbungsmodell.
Kombinationsvererbungsfragen:
Der SuperType -Konstruktor wird zweimal aufgerufen, einmal beim Erstellen eines Subtyp -Prototyps und der anderen Zeit innerhalb des Subtyp -Konstruktors.
Um dieses Problem zu lösen, müssen wir eine parasitäre Kombinationsvererbe verwenden.
4. Prototyp -Vererbung
Funktionsobjekt (proto) {Funktion f () {} f.prototype = proto; Neue f () zurückgeben; } var person = {name: 'mumu', Freunde: ['xiaxia', 'susu']}; var otherperson = Object (Person); otherperson.friends.push ('Wen'); var stedanotherperson = Objekt (Person); otherperson.friends.push ('tian'); console.log (person.friends); // ["xiaxia", "susu", "wen", "tian"] consoleEine kurze Analyse: Funktionsobjekt (Proto) ist eine temporäre Relaisfunktion. Der Parameterproto in IT stellt ein zu übergebenes Objekt dar. Der F () -Konstruktor ist ein temporäres neu erstelltes Objekt, mit dem das übergebene Objekt gespeichert wird. F.Prototyp = Proto; Weisen Sie dem Prototypobjekt des F -Konstruktors die Objektinstanz zu und geben Sie schließlich die Objektinstanz des übergebenen Objekts zurück. Prototyp -Vererbung oder Freigabeattribute von Referenztypen.
5. Parasitäre Erbschaft
// Temporary Transit Function Object (Proto) {Funktion f () {} f.prototype = proto; Neue f () zurückgeben; } // Parasit -Funktion create (proto) {var f = Object (proto); f.love = function () {return this.name; } return f; } var person = {name: 'mumu', Freunde: ['xiaxia', 'susu']}; var otherperson = create (Person); console.log (otherperson.love ()); Parasitäre Kombinationserbranz6. Parasitäre Kombinationserbranz
Funktionsobjekt (proto) {Funktion f () {} f.prototype = proto; Neue f () zurückgeben; } // Parasit -Funktion Funktion erstellen (Person, Arbeiter) {var f = Object (Person.Prototyp); // Objekt erstellen f.constructor = Worker; // Passen Sie den Prototypenkonstruktionszeiger an und verbessern Sie den Objektarbeiter. this.age = Alter; } Person.Prototype.Showname = function () {console.log (this.name); } Funktionsarbeiter (Name, Alter, Job) {Person.call (this, Name, Alter); this.job = Job; } create (Person, Arbeiter); // Parasit -Kombination Erbschaft var p1 = neue Person ('Mumu', '18', 'Student'); p1.Showname ();Diese Methode ist auch die perfekte und idealste Möglichkeit, Vererbungsmethoden zu implementieren.
Das obige JavaScript -Erbschaltnotizen [muss für Anfänger lesen] sind der gesamte Inhalt, der vom Editor geteilt wird. Ich hoffe, es kann Ihnen eine Referenz geben und ich hoffe, Sie können Wulin.com mehr unterstützen.