Heim >Web-Frontend >js-Tutorial >Der Unterschied zwischen __proto__ und Prototyp in JS
In JS sind __proto__ und Prototyp zwei Attribute, die sich auf Prototypen beziehen und leicht unterschiedliche Funktionen haben. In diesem Artikel werden die Unterschiede zwischen den beiden im Detail vorgestellt und verglichen sowie entsprechende Codebeispiele bereitgestellt.
Lassen Sie uns zunächst ihre Bedeutung und Verwendung verstehen.
__proto__ ist eine integrierte Eigenschaft eines Objekts, die verwendet wird, um auf den Prototyp des Objekts zu verweisen. Jedes Objekt verfügt über ein __proto__-Attribut, einschließlich benutzerdefinierter Objekte, integrierter Objekte und Funktionsobjekte. Über das Attribut __proto__ können wir auf die Prototypenkette des Objekts zugreifen und diese bearbeiten.
Sehen wir uns ein Beispiel an:
let obj = {}; console.log(obj.__proto__); // 输出:Object {} let arr = []; console.log(arr.__proto__); // 输出:Array [] function func() {} console.log(func.__proto__); // 输出:[Function]
Im obigen Code haben wir ein leeres Objekt obj erstellt und auf dessen Attribut __proto__ zugegriffen. Wie Sie sehen können, zeigt obj.__proto__ auf ein Object{}-Objekt. In ähnlicher Weise haben wir auch ein leeres Array arr erstellt und auf dessen __proto__-Attribut zugegriffen. Das Ergebnis ist, dass arr.__proto__ auf ein Array[]-Objekt zeigt. Für das Funktionsobjekt func zeigt sein __proto__ auf ein [Funktions]-Objekt.
Zusammenfassend lässt sich sagen, dass das Attribut __proto__ verwendet wird, um auf den Prototyp des Objekts zu verweisen, über den wir auf die Prototypenkette zugreifen und diese betreiben können.
Prototyp ist ein eindeutiges Attribut von Funktionsobjekten, das auf ein Prototypobjekt verweist. Jedes Funktionsobjekt verfügt über ein Prototypattribut, das jedoch nur dann sinnvoll ist, wenn die Funktion als Konstruktor verwendet wird.
Sehen wir uns ein Beispiel an:
function Person() {} console.log(Person.prototype); // 输出:Person {}
Im obigen Code definieren wir ein Person-Funktionsobjekt und greifen auf dessen Prototypattribut zu. Wie Sie sehen, zeigt Person.prototype auf ein Person{}-Objekt.
Die Hauptaufgabe des Prototypattributs besteht darin, die Prototypkette des Instanzobjekts im Konstruktormodus aufzubauen. Wenn wir einen Konstruktor verwenden, um ein Objekt zu erstellen, verweist sein __proto__-Attribut auf das Prototyp-Attribut des Konstruktors.
let person = new Person(); console.log(person.__proto__ === Person.prototype); // 输出:true
Im obigen Code verwenden wir den Person-Konstruktor, um ein Objekt „Person“ zu erstellen. Es stellt sich heraus, dass person.__proto__ auf Person.prototype verweist.
__Proto__ und Prototyp beziehen sich beide auf den Prototyp des Objekts. Die Verbindungen und Unterschiede zwischen ihnen sind wie folgt:
Das folgende Codebeispiel wird verwendet, um den Unterschied und die Verbindung zwischen den beiden weiter zu veranschaulichen:
function Animal() {} Animal.prototype.eat = function() { console.log("Animal is eating"); }; function Dog() {} Dog.prototype = Object.create(Animal.prototype); Dog.prototype.bark = function() { console.log("Dog is barking"); }; const dog1 = new Dog(); dog1.eat(); // 输出:Animal is eating dog1.bark(); // 输出:Dog is barking console.log(dog1.__proto__ === Dog.prototype); // 输出:true console.log(Dog.prototype.__proto__ === Animal.prototype); // 输出:true
Im obigen Code erstellen wir eine Vererbungsbeziehung, indem wir den Animal-Konstruktor und den Dog-Konstruktor definieren. Über die Attribute „__proto__“ und „prototyp“ können wir auf die Prototypenkette des Objekts zugreifen und die Verbindung zwischen ihnen nachweisen.
Zusammenfassend lässt sich sagen, dass __proto__ und Prototyp beide mit Prototypen in JS verwandt sind, sich jedoch in Funktion und Verwendung unterscheiden. Das Verständnis ihrer Unterschiede kann uns helfen, den Prototypmechanismus in JS besser zu verstehen und sie beim Schreiben von Code flexibler zu nutzen.
Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen __proto__ und Prototyp in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!