Beispielanalyse von JavaScript-Prototyp-Kettenadditionsmethoden und auftretenden Problemen

Die Grundidee der Prototypkettenvererbung besteht darin, ein Prototypobjekt auf eine Instanz eines anderen Typs verweisen zu lassen

function SuperType() { 
 this.property = true 
} 
SuperType.prototype.getSuperValue = function () { 
 return this.property 
} 
function SubType() { 
 this.subproperty = false 
} 
SubType.prototype = new SuperType() 
SubType.prototype.getSubValue = function () { 
 return this.subproperty 
} 
var instance = new SubType() 
console.log(instance.getSuperValue()) // true

Der Code definiert zwei Typen, SuperType und SubType. Jeder Typ verfügt über ein Attribut und eine Methode. SubType erbt SuperType. Die Vererbung wird durch Erstellen einer Instanz von SuperType und Zuweisen der Instanz zu SubType.prototype erreicht.

Der Kern der Implementierung besteht darin, das Prototypobjekt neu zu schreiben und durch eine Instanz eines neuen Typs zu ersetzen. Dann sind alle Eigenschaften und Methoden, die in der Instanz von SuperType vorhanden sind, jetzt auch in SubType.prototype vorhanden.

Wir wissen, dass beim Erstellen einer Instanz ein interner Zeiger im Instanzobjekt vorhanden ist, der auf den Prototyp verweist, der sie erstellt hat. Hier wird auch der Code SubType.prototype = new SuperType() angezeigt In SubType erstellt .prototype einen internen Zeiger, der SubType.prototype mit SuperType verknüpft.

Die Instanz zeigt also auf den Prototyp von SubType und der Prototyp von SubType zeigt auf den Prototyp von SuperType. Wenn die Instanz dann die Methode getSuperValue() aufruft, sucht sie weiter entlang dieser Kette.

Methode hinzufügen

Wenn beim Hinzufügen einer Methode zum SubType-Prototyp die übergeordnete Klasse ebenfalls denselben Namen hat, überschreibt SubType diese Methode, um den Zweck von re zu erreichen - . Diese Methode existiert jedoch weiterhin in der übergeordneten Klasse.

Denken Sie daran, es nicht in wörtlicher Form hinzuzufügen, da die Instanzvererbung im Wesentlichen ein Umschreiben ist. Wenn Sie erneut die wörtliche Form verwenden, wird es erneut umgeschrieben, aber dieses Mal folgt auf das Umschreiben kein Es gibt Keine Verbindung zur übergeordneten Klasse, daher wird die Prototypenkette abgeschnitten.

function SuperType() { 
 this.property = true 
} 
SuperType.prototype.getSuperValue = function () { 
 return this.property 
} 
function SubType() { 
 this.subproperty = false 
} 
SubType.prototype = new SuperType() 
SubType.prototype = { 
 getSubValue:function () { 
 return this.subproperty 
 } 
} 
var instance = new SubType() 
console.log(instance.getSuperValue()) // error

Probleme

Wenn man die Prototyp-Kettenvererbung einfach verwendet, liegt das Hauptproblem in Prototypen, die Referenztypwerte enthalten.

function SuperType() { 
 this.colors = ['red', 'blue', 'green'] 
} 
function SubType() { 
} 
SubType.prototype = new SuperType() 
var instance1 = new SubType() 
var instance2 = new SubType() 
instance1.colors.push('black') 
console.log(instance1.colors) // ["red", "blue", "green", "black"] 
console.log(instance2.colors) // ["red", "blue", "green", "black"]

Der SuperType-Konstruktor definiert ein Farbattribut, wenn SubType über die Prototypenkette geerbt wird. Dieses Attribut wird in SubType.prototype angezeigt, genau wie SubType.prototype.colors speziell erstellt wurde. Dies führt dazu Alle Instanzen von SubType teilen sich dieses Attribut. Wenn also Instanz1 den Referenztypwert von Farben ändert, wird dies auch in Instanz2 widergespiegelt.

Das obige ist der detaillierte Inhalt vonBeispielanalyse von JavaScript-Prototyp-Kettenadditionsmethoden und auftretenden Problemen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!