Heim > Web-Frontend > js-Tutorial > Wie funktioniert das Schlüsselwort „new' in JavaScript, um Objekte zu erstellen und Vererbung zu implementieren?

Wie funktioniert das Schlüsselwort „new' in JavaScript, um Objekte zu erstellen und Vererbung zu implementieren?

Linda Hamilton
Freigeben: 2024-12-24 12:24:11
Original
994 Leute haben es durchsucht

How Does the `new` Keyword Work in JavaScript to Create Objects and Implement Inheritance?

Das „neue“ Schlüsselwort in JavaScript erkunden

Das „neue“ Schlüsselwort verstehen

In JavaScript spielt das Schlüsselwort „new“ eine zentrale Rolle bei der Objekterstellung und dem Konzept der Vererbung. Trotz des Rufs von JavaScript als nicht objektorientierte Sprache führt es durch das Schlüsselwort „new“ einen einzigartigen Ansatz für die objektbasierte Programmierung ein.

Zweck des Schlüsselworts „new“

Das Schlüsselwort „neu“ hat mehrere Hauptaufgaben:

  1. Objekterstellung: Es initiiert die Erstellung eines neuen Objekts.
  2. Prototyp-Einstellung: Es setzt die interne [[Prototyp]]-Eigenschaft des neu erstellten Objekts auf das externe Prototypobjekt der Konstruktorfunktion.
  3. 'this'-Referenz: Es weist die Variable 'this' der neu erstellten Variable zu Objekt.
  4. Konstruktoraufruf: Es löst die Ausführung der Konstruktorfunktion mit dem neu erstellten Objekt als Kontext aus.
  5. Objektrückgabe: Es Gibt das neu erstellte Objekt zurück, es sei denn, die Konstruktorfunktion gibt eine Objektreferenz ungleich Null zurück.

Verstehen [[prototype]]- und „prototype“-Eigenschaften

  • [[prototype]]-Eigenschaft: Diese interne Eigenschaft ist für jedes Objekt eindeutig und speichert einen Verweis auf die Objekte Prototyp. Es kann nicht direkt geändert werden, kann aber mit Object.getPrototypeOf() aufgerufen werden.
  • 'prototype'-Eigenschaft: Dies ist eine zugängliche Eigenschaft, die ausschließlich Funktionsobjekten vorbehalten ist. Es ermöglicht den Zugriff auf das Prototypobjekt, das von allen Instanzen gemeinsam genutzt wird, die mit der Funktion als Konstruktor erstellt wurden.

Beispiel für die Objekterstellung mit „neu“

function ObjMaker() { this.a = 'first'; }
// 'ObjMaker' is the constructor function

ObjMaker.prototype.b = 'second';
// 'ObjMaker.prototype' is the prototype object

obj1 = new ObjMaker();
// 'new' creates a new 'obj1' object, assigns the prototype, and executes 'ObjMaker'

obj1.a; // 'first'
obj1.b; // 'second'
// 'obj1' inherits 'b' from 'ObjMaker.prototype' while still accessing its own property 'a'
Nach dem Login kopieren

Hierarchie der Vererbung mit „neu“

Durch die Mit dem Schlüsselwort „new“ ermöglicht JavaScript ein prototypbasiertes Vererbungsmodell. Durch Festlegen der Eigenschaft [[prototype]] erben Objekte Eigenschaften und Methoden vom Prototyp ihres Konstruktors. Dies ermöglicht die Erstellung von Unterklassen, die bestehende Klassen erweitern, wie folgt:

function SubObjMaker() {}
SubObjMaker.prototype = new ObjMaker(); // deprecated, use Object.create() now

SubObjMaker.prototype.c = 'third';
obj2 = new SubObjMaker();

obj2.c; // 'third'
obj2.b; // 'second'
obj2.a; // 'first'
// 'obj2' inherits 'c' from 'SubObjMaker.prototype', 'b' from 'ObjMaker.prototype', and 'a' from 'ObjMaker'
Nach dem Login kopieren

Zusammenfassend lässt sich sagen, dass das Schlüsselwort „new“ in JavaScript nicht nur die Objekterstellung erleichtert, sondern auch einen flexiblen Vererbungsmechanismus ermöglicht, der klassenbasiert simuliert Programmierung.

Das obige ist der detaillierte Inhalt vonWie funktioniert das Schlüsselwort „new' in JavaScript, um Objekte zu erstellen und Vererbung zu implementieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage