Code -Wiederverwendung und seine Prinzipien
代码复用, wie der Name schon sagt, besteht darin, Teil oder sogar den gesamten Code wiederzuverwenden, der zum Erstellen eines neuen Programms geschrieben wurde. Wenn wir über die Wiederverwendung von Code sprechen, können wir als Erstes die继承性vorstellen. Das Prinzip der Code -Wiederverwendung ist:
优先使用对象组合,而不是类继承In JS ist das Konzept der Instanzen, da es kein Klassenkonzept gibt, nicht sehr sinnvoll. Objekte in JS sind einfache Schlüsselwertpaare, die dynamisch erstellt und modifiziert werden können.
In js können wir jedoch ein Objekt mit Konstruktoren und new Operatoren instanziieren, die eine Syntax -Ähnlichkeit mit anderen Programmiersprachen haben, die Klassen verwenden.
Zum Beispiel:
var trigkit4 = new Person(); js scheint eine Klasse zu sein, wenn sie die Konstruktor Person nennt, aber es ist tatsächlich immer noch eine Funktion, die uns einige Entwicklungsideen und Erbschaftsmuster gibt, von denen angenommen wird, dass sie auf der Klasse basieren, die wir als "klassische Vererbungsmuster" bezeichnen können.
Das traditionelle Vererbungsmodell erfordert das Schlüsselwort class . Wir gehen davon aus, dass das obige Klassenvererbungsmodell现代继承模式ist, das ein Modell ist, das nicht auf eine klassenweise Art und Weise berücksichtigt werden muss.
Klassischer Vererbungsmodus
Siehe die folgenden zwei Beispiele des Konstruktors Parent() und Child() :
<script type="text/javascript">Funktion Eltern (Name) {
this.name = name || 'Allen';
}
Parent.prototype.say = function () {
kehre diesen namennamen zurück;
}
Funktion child (Name) {}
// Erstellen Sie ein Objekt mit dem übergeordneten Konstruktor und weisen dem Objekt dem untergeordneten Prototyp zu, um die Vererbung zu erreichen
Funktion inherit (c, p) {
C.Prototype = new P (); // Prototyp -Attribut sollte auf ein Objekt verweisen, nicht auf eine Funktion
}
// die deklarierte erbliche Funktion aufrufen
Erbe (Kind, Eltern);
</script>
Wenn ein Objekt unter Verwendung der new Child() -Anweisung erstellt wird, erhält es seine Funktionalität von Parent() Instanz durch den Prototyp, wie z. B.:
var kid = new Child();kid.say();//AllenPrototypkette
Lassen Sie uns diskutieren, wie Prototyp -Ketten im Unterrichtserbschaftsmodus funktionieren. Wir betrachten Objekte als Blöcke irgendwo im Speicher, die Daten und Verweise auf andere Blöcke enthalten. Wenn ein Objekt mit der new Parent() -serklärung erstellt wird, wird ein solcher Block links in der folgenden Abbildung erstellt. Dieser Block speichert name . Wenn Sie say() zugreifen möchten, können wir Parent.prototype __proto__ rechts zugreifen, indem wir auf prototype -Attribut des Konstruktors Parent() hinweisen.
Was passiert also beim Erstellen eines neuen Objekts mit var kid = new Child() ? Wie in der Abbildung unten gezeigt:
Das mit new Child() erstellte Objekt ist bis auf den impliziten Link __proto__ fast leer. In diesem Fall verweist __proto__ auf das Objekt, das mit der new Parent() -Anweisung in der Funktion inherit() erstellt wurde
Bei der Ausführung kid.say() , da das Blockobjekt in der unteren linken Ecke keine say() -Methode hat, wird das mittlere Blockobjekt über die Prototypkette abfragt. Das Middle Block -Objekt hat jedoch auch keine say() -Methode, daher folgt es der Prototyp -Kette, um das Blockobjekt rechts abzufragen, und das Objekt hat zufällig say() -Methode. Ist es fertig?
Die Ausführung ist hier nicht fertig. this.name wird in say() verwiesen, die auf das vom Konstruktor erstellte Objekt hinweist. Hier zeigt es auf den Block new Child() . Es gibt jedoch kein name in new Child() . Aus diesem Grund wird der Zwischenblock abgefragt und der Zwischenblock hat zufällig name . Zu diesem Zeitpunkt wurde die Abfrage der Prototypkette abgeschlossen.
Weitere detailliertere Diskussion
Gemeinsamer Prototyp
Die Regel dieses Musters ist, dass wiederverwendbare Mitglieder eher auf den Prototyp übertragen werden sollten als in dies. Daher sollte zum Zweck der Erbschaft alles im Prototyp implementiert werden. Daher können Sie den Prototyp des untergeordneten Objekts und den Prototyp des übergeordneten Objekts auf das gleiche wie das folgende Beispiel festlegen:
function inherit(C,P){C.Prototype = p.Prototype;
}
Das untergeordnete Objekt und das übergeordnete Objekt teilen denselben Prototyp und können gleichermaßen auf say() zugreifen. Das untergeordnete Objekt erbt jedoch nicht name
Prototyp -Vererbung
Der Prototyp -Vererbung ist ein "modernes" klassenloser Vererbungsmodell. Siehe das folgende Beispiel:
<script type="text/javascript">// das zu vererbte Objekt
var parent = {
Name: "Jack" // Es gibt hier kein Semikolon
};
//新对象var child = Objekt (Eltern);
alert(child.name);//Jack</script>
Im Prototyp -Modus ist es nicht erforderlich, Objektliterale zum Erstellen von übergeordneten Objekten zu verwenden. Wie im folgenden Code gezeigt, können Sie mit dem Konstruktor das übergeordnete Objekt erstellen. Dabei werden sowohl ihre eigenen Eigenschaften als auch die Eigenschaften des Prototyps des Konstruktors vererbt.
<script type="text/javascript">// Elternkonstruktor
Funktion person () {
this.name = "trigkit4";
}
// zum Prototypenattribut hinzufügen
Person.Prototype.getName = function () {
kehre diesen namennamen zurück;
};
// Erstellen Sie ein neues Personenklassenobjekt
var obj = new Person ();
//erben
var kid = Objekt (obj);
alert (kid.getName ()); // trigkit4
</script>
In diesem Modus können Sie nur das Prototyp -Objekt erben, das im vorhandenen Konstruktor vorhanden ist. Objekte erben von Objekten, unabhängig davon, wie das übergeordnete Objekt erstellt wird, wie im folgenden Beispiel gezeigt:
<script type="text/javascript">// Elternkonstruktor
Funktion person () {
this.name = "trigkit4";
}
// zum Prototypenattribut hinzufügen
Person.Prototype.getName = function () {
kehre diesen namennamen zurück;
};
// Erstellen Sie ein neues Personenklassenobjekt
var obj = new Person ();
//erben
var kid = Object (Person.Prototyp);
console.log (typeof kid.getName); // Funktion, da es sich im Prototyp befindet
console.log (typeof kid.name); // undefiniert, da nur dieser Prototyp vererbt wird
</script>