Unterschiede zwischen ES6-Vererbung und ES5-Vererbung in js

Nachlass

ES5-Prototypvererbung

Die Vererbung wird über die Prototypenkette (Konstruktor + [[Prototyp]]) erreicht. (Hinweis: Ich werde __proto__ künftig in der Form [[Prototyp]] schreiben)
Der Prototyp einer Unterklasse ist eine Instanz des Objekts der übergeordneten Klasse. Daher enthält das Prototypobjekt der Unterklasse einen Zeiger auf das Prototypobjekt der übergeordneten Klasse, und die Instanzattribute der übergeordneten Klasse sind die Attribute des Unterklassenprototyps.

// Übergeordnete Klasse: Funktion SuperType; Unterklasse: Funktion SubType;
SubType.prototype = neuer SuperType(); // SubType erbt SuperType

// Gemäß dem im vorherigen Abschnitt zur Prototypenkette erwähnten Wissenspunkt: Das __proto__ des instanziierten Objekts ist gleich dem Prototyp des Konstruktors
SubType.prototype.__proto__ === SuperType.prototype // wahr

Die obige Vererbungsbeziehung ist wie folgt:

In Bezug auf den internen Implementierungsmechanismus besteht die Vererbung von ES5 tatsächlich darin, zuerst ein Instanzobjekt der Unterklasse this zu erstellen und dann die Methode der übergeordneten Klasse this hinzuzufügen. Ähnliche Verwendung: Father.apply(this)

ES6-Klassenvererbung

Die Vererbung wird durch „Extensiv“ + „Super“ der Klasse erreicht.
Die Unterklasse hat kein eigenes this-Objekt, daher muss sie das this-Objekt der übergeordneten Klasse über super im Konstruktor erben und dann diesem this-Objekt Methoden und Eigenschaften hinzufügen.
Das Schlüsselwort super im Konstruktor stellt den Konstruktor der übergeordneten Klasse dar und wird verwendet, um ein neues this-Objekt der übergeordneten Klasse zu erstellen.
In Bezug auf den internen Implementierungsmechanismus ist der Vererbungsmechanismus von ES6 völlig anders. Im Wesentlichen wird zuerst ein Instanzobjekt der übergeordneten Klasse this erstellt. Dazu muss die Supermethode im Voraus aufgerufen werden. Anschließend wird der this-Zeiger mithilfe des Unterklassenkonstruktors geändert.

Super Nutzung

super kann als Funktion und als Objekt verwendet werden.
Bei Verwendung als Funktion kann es nur im Konstruktor einer Unterklasse verwendet werden – es stellt den Konstruktor der übergeordneten Klasse dar, aber das „this“ in super bezieht sich auf die Instanz der Unterklasse, sodass super() in der Unterklasse Father.prototype.constructor.call(this) bedeutet.
Bei Verwendung als Objekt stellt super das Prototypobjekt der übergeordneten Klasse dar, d. h. Father.prototype

Der Unterschied zwischen den beiden

A: Sie sind nicht genau gleich. Es gibt mehrere Hauptunterschiede:

1. Die Schrift ist anders. Klassenvererbung wird durch das Schlüsselwort „Extended“ sowie die Superfunktion und die Supermethode erreicht. (Ich werde nicht näher darauf eingehen, wie man Super zur Implementierung der Vererbung verwendet.)
2. Innerhalb einer Klasse definierte Methoden sind nicht aufzählbar, aber bei ES5 ist das anders.
3. Klassen haben keine variable Förderung, was sich völlig von ES5 unterscheidet
4. Eine Klasse entspricht dem Prototyp einer Instanz und alle in der Klasse definierten Methoden werden von der Instanz übernommen. Wenn Sie vor einer Methode das Schlüsselwort static hinzufügen, bedeutet dies, dass die Methode nicht von Instanzen geerbt wird, sondern direkt über die Klasse aufgerufen wird, die zu einer statischen Methode wird.
5. Die internen Umsetzungsmechanismen sind unterschiedlich.

Interne Implementierung der ES5-Prototypvererbung

Bei der Vererbung in ES5 wird im Wesentlichen zuerst ein Instanzobjekt der Unterklasse „this“ erstellt und dann die Methode der übergeordneten Klasse zur Unterklasse „(this)“ hinzugefügt --- Father.apply(this).

Interne Implementierung der ES6-Klassenvererbung

Der Vererbungsmechanismus von ES6 ist völlig anders. Im Wesentlichen erstellt es zuerst ein Instanzobjekt this der übergeordneten Klasse, legt die Eigenschaften und Methoden der übergeordneten Klasse darauf ab (vorausgesetzt, es wird über die Superfunktion aufgerufen) und verwendet dann den Konstruktor der untergeordneten Klasse, um this zu ändern.

Aufgrund der unterschiedlichen Implementierungsmechanismen gibt es bei der Vererbung nativer Konstruktoren einige Unterschiede zwischen diesen beiden Vererbungsarten:

es5-Schreiben kann keine nativen Konstruktoren erben (wie Array, Number usw.).
Da die Vererbung von es5 zuerst das Instanzobjekt this der Unterklasse erstellt und dann die Eigenschaften und Methoden des Prototyps der übergeordneten Klasse in die Unterklasse umschreibt, kann die Vererbungsmethode von es5 den nativen Konstruktor nicht erben, da auf die internen Eigenschaften der übergeordneten Klasse nicht zugegriffen werden kann.
es6 ermöglicht die Vererbung von Konstruktoren zum Generieren von Unterklassen. Da es6 zuerst das Instanzobjekt this der übergeordneten Klasse erstellt und es dann mit dem Konstruktor der Unterklasse ändert, kann die Unterklasse alle Eigenschaften und Methoden der übergeordneten Klasse erben. Daher kann eine Klasse die Unterklasse des nativen Konstruktors erben und anpassen. Extends können nicht nur zum Erben von Klassen verwendet werden, sondern auch zum Erben nativer Konstruktoren. Daher ist es möglich, benutzerdefinierte Datenstrukturen auf der Grundlage nativer Datenstrukturen zu erstellen.

Erweiterungen

Eine Beschreibung des internen Implementierungsmechanismus finden Sie im entsprechenden Abschnitt von „Ruan Yifengs es6-Dokument – ​​Klassenvererbung“.

Damit ist dieser Artikel über die Unterschiede zwischen ES6- und ES5-Vererbung in Java abgeschlossen. Weitere Informationen zu den Unterschieden zwischen ES6- und ES5-Vererbung finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!