Leicht verständliche Analyse von JS-Prototypen und Prototypenketten

Dieses Mal werde ich Ihnen eine leicht verständliche Analyse von JS-Prototypen und Prototypketten geben. Was sind die Vorsichtsmaßnahmen für das Parsen von JS-Prototypen und Prototypketten? .

Objekte im Browser

Welche Objekte gibt es im Browser? In ES ist das globale Objekt global, während es in Browsern das globale Objekt Fenster ist.

Geben Sie window in der Chrome-Konsole ein und wir können sehen, was sich im Fenster befindet.

Die folgenden Objekte können im Fenster gefunden werden.
Attribute wie Object, String, Numbr, Boolean, Array, Date, Math, parseInt und parseFloat sind alle von ES angegebene erforderliche Objekte.
Zum Beispiel „Dokument“, „Warnung“, „Eingabeaufforderung“, „ATOB“ usw. Dies sind in den Browser integrierte Attribute.

Diese Objekte haben alle Hash-Strukturen. Unter „Objekt“ verfügt String beispielsweise über eigene Attribute und Methoden sowie entsprechende API-Aufrufe.

Einfache Typen und Objekte

Die Beispiele lauten wie folgt: n1 ist ein einfacher Typ und n2 ist ein Objekt.

var n1 = 'a'var n2 = new String('a')
n1.length
n1.hasOwnProperty('0')
n2.length
n2.hasOwnProperty('0')
n1.xxx = 2n1.xxx // undefined

Differenz

Der n1-Wert wird im Stapel gespeichert. Wenn n2 zugewiesen wird, wird im Stapel eine Adresse erstellt, die auf den Heap zeigt, und im Heap-Speicher wird ein neues Objekt vom Typ String erstellt. Sie können sehen, dass es im Objekt n2 einige Attribute sowie das Prototyp-Attribut gibt.

Attribute

n2 ist ein Objekt, das ein Längenattribut hat, daher heißt es. n1 ist nur eine Zeichenfolge . Warum hat sie auch ein Längenattribut

? Es kann so verstanden werden: Wenn n1.length, führt js die folgenden Operationen aus: var temp = new String(n1);n1.length ;Das heißt, bei Verwendung von Attributen oder Methoden wird vorübergehend ein neues Objekt im Heap-Speicher erstellt. Dieses Objekt ist vom entsprechenden String-Typ und wird nach der Ausführung zerstört. Daher meldet die Operation n1.xxx = 2 keinen Fehler, n1.xxx zeigt jedoch erneut undefiniert an, da die Daten von n1 im Heap-Speicher zu diesem Zeitpunkt zerstört wurden.

Daher wird in js die neue Methode eines neuen Objekts selten verwendet, sondern die Variable wird direkt zugewiesen.

hasOwnProperty() in n2

hasOwnProperty() ist eine Methode im Typ Object-Klasse. Sie ist nicht unter dem Typ Sting zu finden.

Hier ist hasOwnProperty() in n2.proto.proto. n2.proto zeigt auf String.prototype und String.prototype.proto zeigt schließlich auf Object.prototype. String ist ein Prototyp und Object ist ebenfalls ein Prototyp. Object.prototype speichert alle öffentlichen Eigenschaften des Objekttyps.

Auf diese Weise kann effektiv Platz gespart und die Aufzeichnung vieler Attribute in jedem Objekt vermieden werden. Suchen Sie nach Attributen, die in einem Objekt nicht gefunden werden, in dem Objekt, auf das Proto zeigt. Der Punkt, auf den verwiesen wird, ist normalerweise der Prototyp eines bestimmten Prototyps.

Wo finde ich Proto und Prototyp?

var n = new Number(1)var s= new String('1')var o= new Object()

Die oben genannten Methoden können als var object = function () betrachtet werden.
Zusammenfassend: object.proto = function.prototype.

Proto besuchen

Proto ist relativ zum Objekt, um zu sehen, wer das Objekt generiert hat. Für n ist der Vater Number. Gehen Sie also zu Number.prototype, um ihn zu finden. Es gibt auch ein Proto in Number. Suchen Sie beim Zugriff danach im übergeordneten Objekt.

Function
String.proto === Function.prototype //true

Funktionen können auch als Objekte betrachtet werden. Zeichenfolge, Objekt und Zahl sind allesamt Objekte und Funktionen. Da zuvor new String() verwendet wurde, handelt es sich um eine Funktion und der Datentyp des Funktionsrückgabeergebnisses ist Objekt. Strings Vater ist Function.

Function.proto === Function.prototype //trueFunction.prototype.proto === Object.prototype //trueFunction.proto.proto === Object.prototype //true

Wenn die Funktion als ein von der Funktionsmethode generiertes Objekt betrachtet wird,
das heißt, var Function = new Function()
kann Function.proto == verstehen = Function.prototype

Der Typ der Funktion ist die Funktion, die aus der Funktion konstruiert wird. Der Zusammenhang ist aus dem Bild oben ersichtlich. Bei new String () ist der String-Typ ebenfalls eine Funktion, und String.proto zeigt auf Function.prototype.

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

So vermeiden Sie Funktionen und Browser-Inferenzen in JS

Detaillierte Erläuterung der Anwendungsfälle für JS-Fassadenmuster

Das obige ist der detaillierte Inhalt vonLeicht verständliche Analyse von JS-Prototypen und Prototypenketten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!