Heim  >  Artikel  >  Web-Frontend  >  Der Unterschied zwischen __proto__ und Prototyp in JS

Der Unterschied zwischen __proto__ und Prototyp in JS

PHPz
PHPzOriginal
2024-02-19 13:38:06534Durchsuche

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

__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

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.

Unterschiede und Verbindungen

__Proto__ und Prototyp beziehen sich beide auf den Prototyp des Objekts. Die Verbindungen und Unterschiede zwischen ihnen sind wie folgt:

  1. __proto__ ist ein Attribut des Instanzobjekts, das verwendet wird, um auf den Prototyp des Objekts zu verweisen Objekt; während Prototyp das Konstruktor-Attribut ist, das verwendet wird, um auf das Prototyp-Objekt des Konstruktors zu verweisen.
  2. __proto__ ist eine Eigenschaft, die die Prototypenkette des Objekts liest und darauf zugreift und auf die direkt auf dem Instanzobjekt zugegriffen werden kann. Prototyp ist eine Eigenschaft des Konstruktors und kann nur innerhalb des Konstruktors aufgerufen werden.
  3. __proto__ kann über Object.setPrototypeOf() oder direkte Zuweisung geändert werden, während Prototyp nur über die Funktion name.prototype im Konstruktor geändert werden kann.
  4. __proto__ ist ein nicht standardmäßiges Attribut, das nur von einigen Browsern unterstützt wird. Prototyp ist ein Standardattribut und alle Objekte und Funktionen verfügen über es.

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!

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