Heim >Web-Frontend >js-Tutorial >Was sind Prototypobjekte und Prototypketten in js?

Was sind Prototypobjekte und Prototypketten in js?

巴扎黑
巴扎黑Original
2017-07-18 17:04:171439Durchsuche

In Javascript ist alles ein Objekt, aber Objekte sind auch unterschiedlich und können grob in zwei Kategorien unterteilt werden, nämlich: Gemeinsames Objektobjekt und Funktionsobjektfunktion.

Im Allgemeinen Die durch die neue Funktion generierten Objekte sind Funktionsobjekte, und andere Objekte sind gewöhnliche Objekte.

Beispiel:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function f1(){
    //todo
}
var f2 = function(){
    //todo
};
var f3 = new Function('x','console.log(x)');
var o1 = {};
var o2 = new Object();
var o3 = new f1();
console.log(
    typeof f1,//function
    typeof f2,//function
    typeof f3,//function
    typeof o1,//object
    typeof o2,//object
     typeof o3 //object
);
>> function function function object object object

f1 ist eine Funktionsdeklaration Die gebräuchlichste Methode zum Definieren einer Funktion ist f2. Diese anonyme Funktion wird f2 zugewiesen, was kein üblicher Funktionsausdruck ist, sondern auch ein Funktionsobjekt.

Funktion ist ein Objekt, das mit JS geliefert wird. Wenn f1 und f2 erstellt werden, erstellt JS diese Objekte automatisch durch new Function().

Es gibt zwei Möglichkeiten, Objekte in Javascript zu erstellen: Objektliterale und die Verwendung neuer Ausdrücke. Konzentrieren wir uns auf diese beiden Methoden, wenn Sie Java- und C#-Ideen verwenden. o3 ist ein Instanzobjekt von f1, und o3 und f1 sind vom gleichen Typ, aber das ist nicht der Fall...

Wie verstehen Sie das? Sehen Sie, ob o3 übergeben wird neue Funktion Was offensichtlich nicht generiert wird, da es sich nicht um ein Funktionsobjekt handelt, sondern um ein gewöhnliches Objekt.

Nach einem einfachen Verständnis von Funktionsobjekten und gewöhnlichen Objekten werfen wir einen Blick auf den Prototyp und die Prototypenkette in Javascript:

In JS wird jedes Mal, wenn ein Funktionsobjekt f1 erstellt wird, das Es gibt Einige in das Objekt integrierte Attribute, einschließlich Prototyp und __proto__, sind Prototypobjekte, die einige Attribute und Methoden von f1 aufzeichnen.

Es ist zu beachten, dass der Prototyp für f1 unsichtbar ist, d. h. f1 sucht nicht nach den Eigenschaften und Methoden im Prototyp.

1
1
2
3
function f(){}
f.prototype.foo = "abc";
console.log(f.foo); //undefined
2
3
Funktion f(){}

f.prototype.foo = "abc";
console.log(f.foo); //undefiniert

1
2
3
4
function f(){}
f.prototype.foo = "abc";
var obj = new f();
console.log(obj.foo); //abc
Was nützt also ein Prototyp? Tatsächlich ist die Hauptfunktion des Prototyps die Vererbung. Laienhaft ausgedrückt sind die im Prototyp definierten Eigenschaften und Methoden für seine eigenen „Nachkommen“ reserviert. Daher können Unterklassen vollständig auf die Eigenschaften und Methoden im Prototyp zugreifen. Um zu wissen, wie f1 den Prototypen in JS überlässt, müssen wir die Prototypenkette in JS verstehen. Dieser Typ sieht auch sehr seltsam aus tief, daher sieht man es oft nicht, aber es existiert sowohl in gewöhnlichen Objekten als auch in Funktionsobjekten. Seine Funktion besteht darin, das Prototypobjekt der übergeordneten Klasse zu speichern. Wenn JS ein Objekt durch den neuen Ausdruck erstellt, ist es normalerweise der Prototyp Die übergeordnete Klasse wird dem __proto__-Attribut des neuen Objekts zugewiesen und bildet so eine Generationenvererbung...
1
2
3
4
function f(){}<div class="line number2 index1 alt1"> <code class="csharp plain">f.prototype.foo = "abc";
var obj = new f ();<div class="line number4 index3 alt1"> <code class="csharp plain">console.log(obj.foo // abc

Jetzt wissen wir, dass __proto__ in obj den Prototyp von f speichert. Was wird also in __proto__ im Prototyp von f gespeichert?

Wie in der Abbildung gezeigt, wird Object.prototype in __proto__ von f.prototype gespeichert. Aus dem Ausgabeergebnis geht hervor, dass Object.__proto__ null ist Ende der Prototypenkette des obj-Objekts. Wie in der folgenden Abbildung gezeigt:

Nachdem das obj-Objekt über eine solche Prototypenkette verfügt, sucht obj bei der Ausführung von obj.foo zunächst, ob es dieses Attribut hat, aber wird nicht nach dem eigenen Prototyp suchen, wenn foo nicht gefunden werden kann, sucht obj entlang der Prototypenkette...

Im obigen Beispiel haben wir das foo-Attribut für den Prototyp von f definiert, dann wird obj diese Eigenschaft gefunden auf der Prototypenkette erstellt und ausgeführt.

Abschließend fassen Sie die wichtigsten Punkte dieses Artikels in wenigen Sätzen zusammen:

  • Die Bildung der Prototypenkette hängt wirklich eher von __proto__ ab Als Prototyp prüft die JS-Engine beim Ausführen der Methode eines Objekts zunächst, ob die Methode im Objekt selbst vorhanden ist. Wenn sie nicht vorhanden ist, sucht sie in der Prototypenkette, jedoch nicht in ihrem eigenen Prototyp.

  • Das __proto__ eines Objekts zeichnet seine eigene Prototypenkette auf und bestimmt seinen eigenen Datentyp. Das Ändern von __proto__ entspricht dem Ändern des Datentyps des Objekts.

  • Der Prototyp einer Funktion gehört nicht zu seiner eigenen Prototypenkette. Er ist der Kern der Unterklassenerstellung, bestimmt den Datentyp der Unterklasse und ist die Brücke, die die Prototypenkette verbindet der Unterklasse.

  • Der Zweck der Definition von Methoden und Eigenschaften für das Prototypobjekt besteht darin, von Unterklassen geerbt und verwendet zu werden.

Das obige ist der detaillierte Inhalt vonWas sind Prototypobjekte und Prototypketten in js?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn