Kürzlich las ich online über die Erfahrungen einer Person während eines Interviews mit Taobao und stellte dann fest, dass es viele Dinge gab, über die ich mir nicht im Klaren war. Deshalb habe ich einige Artikel geschrieben, um mein Verständnis einiger Themen zu vertiefen.
Eine im Artikel erwähnte Frage lautet: Wie implementiert JavaScript die Vererbung?
Im Folgenden werde ich einige Methoden und Beispiele erläutern, die ich online gefunden habe, um meinen Eindruck zu vertiefen.
Wir wissen, dass Funktionen in JavaScript nicht nur für Funktionsdefinitionen, sondern auch für Klassendefinitionen verwendet werden können.
Die Vererbung in JavaScript ist etwas seltsam. Im Gegensatz zu C++ und einigen objektorientierten Sprachen gibt es keine Zugriffskontrollmodifikationen wie öffentlich und privat, und es gibt keine Implementierung oder andere spezifische Symbole, die die Vererbung anzeigen.
Bezüglich der Vererbung von JavaScript-Klassen können Sie sich auf das folgende Beispiel beziehen.
Kopieren Sie den Codecode wie folgt:
<script type="text/javascript">
Funktion Person() {
//Eigenschaften
this.Gender = "weiblich";
this.Age = 18;
this.Words = "Stille";
// Methode
this.shouting = function() {
alarm("Happy! Methode der übergeordneten Klasse");
}
}
//Erben
functionProgrammer() {
this.base = Person;
}
Programmer.prototype = neue Person;
//Neue Methoden zu Unterklassen hinzufügen
Programmer.prototype.typeCode = function() {
Alert("Ich bin Programmierer! IT-Wanderarbeiter, sehr unzufrieden. Unterklassenmethode");
}
// Beispiel aufrufen
Funktion sayHello() {
var a = new Programmer();
Alert(a.Gender); // Rufen Sie die Eigenschaften der übergeordneten Klasse auf
a.shouting(); // Rufen Sie die Methode der übergeordneten Klasse auf
a.typeCode(); // Rufen Sie die Methode der Unterklasse auf
}
sayHello();
</script>
Im obigen Beispiel wird zunächst eine Personenklasse deklariert, die einige Attribute und Methoden enthält, und dann wird eine Programmiererklasse deklariert, die über ein Basisattribut verfügt. Dieses Attribut ist nicht erforderlich, dient jedoch der Spezifikation und zum Auffinden von Objekten die Zukunft Alle geerbten Klassen müssen geschrieben werden, und dann wird die Personenklasse in das Prototypobjekt (Prototyp) des Programmierers kopiert, wodurch die Klassenvererbung realisiert wird.
Simulieren Sie einige Prinzipien von Klassen und Vererbung in JavaScript
In objektorientierten Sprachen verwenden wir Klassen, um ein benutzerdefiniertes Objekt zu erstellen. Allerdings ist alles in JavaScript ein Objekt. Wie erstellt man also ein benutzerdefiniertes Objekt?
Dies erfordert die Einführung eines anderen Konzepts – Prototyp. Wir können Prototyp einfach als Vorlage betrachten. Die neu erstellten benutzerdefinierten Objekte sind alle Kopien dieser Vorlage (Prototyp) (eigentlich keine Kopie, sondern ein Link. Es ist nur so, dass es sich um einen Link handelt). unsichtbar und erweckt den Eindruck, es handele sich um eine Kopie).
Schauen wir uns ein Beispiel für die Erstellung eines benutzerdefinierten Objekts per Prototyp an:
Kopieren Sie den Codecode wie folgt:
//Konstrukteur
Funktion Person(Name, Geschlecht) {
this.name = Name;
this.sex = Geschlecht;
}
//Definieren Sie den Prototyp von Person. Auf die Eigenschaften im Prototyp kann von benutzerdefinierten Objekten verwiesen werden.
Person.prototype = {
getName: function() {
return this.name;
},
getSex: function() {
return this.sex;
}
}
Hier nennen wir die Funktion Person einen Konstruktor, eine Funktion, die ein benutzerdefiniertes Objekt erstellt. Es ist ersichtlich, dass JavaScript die Funktionen von Klassen durch Konstruktoren und Prototypen simuliert.
Das Folgende ist ein Beispiel, um die spezifische Arbeit von JavaScript beim Erstellen eines benutzerdefinierten Objekts im Detail zu erläutern:
Kopieren Sie den Codecode wie folgt:
var zhang = new Person("ZhangSan", "man");
console.log(zhang.getName()); // „ZhangSan“
var chun = new Person("ChunHua", "woman");
console.log(chun.getName()); // „ChunHua“
Wenn der Code var zhang = new Person("ZhangSan", "man") ausgeführt wird, werden intern tatsächlich die folgenden Dinge erledigt:
Erstellen Sie ein leeres Objekt (new Object()).
Kopieren Sie die Attribute (Schlüssel-Wert-Paare) in Person.prototype in dieses leere Objekt (wie bereits erwähnt, ist die interne Implementierung keine Kopie, sondern ein versteckter Link).
Übergeben Sie dieses Objekt über das Schlüsselwort this an den Konstruktor und führen Sie den Konstruktor aus.
Weisen Sie dieses Objekt der Variablen zhang zu.
Alle Arbeiten erledigt.
Um zu beweisen, dass die Prototyp-Vorlage nicht in das instanziierte Objekt kopiert wird, sondern eine Möglichkeit zur Verknüpfung darstellt, sehen Sie sich bitte den folgenden Code an:
Kopieren Sie den Codecode wie folgt:
Funktion Person(Name, Geschlecht) {
this.name = Name;
this.sex = Geschlecht;
}
Person.prototype.age = 20;
var zhang = new Person("ZhangSan", "man");
console.log(zhang.age); // 20
// Überschreibe das Altersattribut im Prototyp
zhang.age = 19;
console.log(zhang.age); // 19
zhang.age löschen;
// Nach dem Löschen des Instanzattributs „Alter“ wird dieser Attributwert erneut vom Prototyp abgerufen
console.log(zhang.age); // 20
Wenn es im obigen Beispiel nur durch Kopieren abgerufen wird, ist das Objekt nach dem Löschen des Altersattributs nicht vorhanden. Das Altersattribut im Beispiel kann jedoch weiterhin ausgegeben werden, oder der vorherige Wert wird überschrieben Nur das gleichnamige Attribut in der Unterklasse wurde gelöscht, und das Altersattribut in der übergeordneten Klasse ist über eine unsichtbare Verknüpfung weiterhin im Objekt vorhanden.
Wie implementiert man eine einfache Vererbung in JavaScript?
Im folgenden Beispiel wird eine Mitarbeiterklasse „Employee“ erstellt, die alle Eigenschaften des Prototyps „Prototyp“ von „Person“ erbt.
Kopieren Sie den Codecode wie folgt:
Funktion Mitarbeiter(Name, Geschlecht, Mitarbeiter-ID) {
this.name = Name;
this.sex = Geschlecht;
this.employeeID = Mitarbeiter-ID;
}
// Den Prototyp von Employee auf eine Instanz von Person verweisen
// Da Instanzen von Person Methoden im Person-Prototyp aufrufen können, können Instanzen von Employee auch alle Eigenschaften im Person-Prototyp aufrufen.
Employee.prototype = neue Person();
Employee.prototype.getEmployeeID = function() {
return this.employeeID;
};
var zhang = new Employee("ZhangSan", "man", "1234");
console.log(zhang.getName()); // "ZhangSan
Okay, das Obige sind einige spezifische Prozesse und Methoden zum Implementieren der Vererbung in JavaScript.
Zusammenfassend lässt sich sagen, dass der Vererbungsmechanismus in JavaScript im Vergleich zu einigen objektorientierten Sprachen grob ist und einige Mängel aufweist. Dies beeinträchtigt jedoch im Allgemeinen immer noch nicht die Effizienz von Front-End-Entwicklern . Begeisterung.