Heim > Artikel > Web-Frontend > Ausführliche Erläuterung der Anwendungsfälle der JS-Objektvererbung
Dieses Mal werde ich Ihnen die Anwendungsfälle der JS-Objektvererbung ausführlich erläutern. Was sind die Vorsichtsmaßnahmen für die Verwendung der JS-Objektvererbung? Das Folgende ist ein praktischer Fall.
Das Modifizieren von Objekten, die Sie nicht besitzen, ist eine gute Lösung für bestimmte Probleme. In einem „gutartigen“ Zustand geschieht dies normalerweise nicht; es kann passieren, dass der Entwickler auf ein Problem gestoßen ist und es dann durch Ändern des Objekts gelöst hat. Dennoch gibt es immer mehr als eine Lösung für ein bekanntes Problem. Ein Großteil des Informatikwissens wurde entwickelt, um schwierige Probleme in statisch typisierten Sprachumgebungen wie Java zu lösen. Möglicherweise gibt es Methoden, sogenannte Design Patterns, die diese Objekte nicht direkt verändern, sondern erweitern.
Außerhalb von JS ist die Vererbung die beliebteste Form der Objekterweiterung. Wenn ein Objekttyp bereits das meiste tut, was Sie wollen, erben Sie von ihm und fügen Sie dann einige Funktionen hinzu. In JS gibt es zwei Grundformen: objektbasierte Vererbung und typbasierte Vererbung.
In JS gibt es bei der Vererbung immer noch einige große Einschränkungen. Erstens können Sie nicht von DOM- oder BOM-Objekten erben. Zweitens funktioniert die Vererbung vom Array aufgrund der komplizierten Beziehung zwischen dem Array-Index und der Längeneigenschaft nicht ordnungsgemäß.
Objektbasierte Vererbung
Bei der objektbasierten Vererbung, auch oft als prototypische Vererbung bezeichnet, erbt ein Objekt ein anderes Objekt, ohne den Konstruktor aufzurufen. Die ES5-Methode Object.create() ist die einfachste Möglichkeit, diese Art der Vererbung zu implementieren. Zum Beispiel:
var person = { name: 'Nicholas', sayName: function () { console.log(this.name); } };var myPerson = Object.create(person); myPerson.sayName(); // "Nicholas"
In diesem Beispiel wird ein neues Objekt „myPerson“ erstellt, das von „person“ erbt. Diese Vererbungsmethode ähnelt dem Prototyp von „myPerson“, der auf „person“ gesetzt wird. Von da an kann „myPerson“ auf die Eigenschaften und Methoden von „person“ zugreifen, ohne die Variable mit demselben Namen für ein neues Objekt neu definieren zu müssen. Wenn Sie beispielsweise myPerson.sayName() neu definieren, wird der Zugriff auf person.sayName() automatisch unterbrochen: Die Methode
myPerson.sayName = function () { console.log('Anonymous'); }; myPerson.sayName(); // "Anonymous"person.sayName(); // "Nicholas"
Object.create() kann einen zweiten Parameter sowie die Eigenschaften und Methoden im Parameterobjekt angeben wird dem neuen Objekt hinzugefügt. Zum Beispiel:
var myPerson = Object.create(person, { name: { value: 'Greg' } }); myPerson.sayName(); // "Greg"person.sayName(); // "Nicholas"
Das in diesem Beispiel erstellte myPerson-Objekt hat seinen eigenen Namensattributwert, daher zeigt der Aufruf von sayName() „Greg“ anstelle von „Nicholas“ an.
Sobald ein neues Objekt auf diese Weise erstellt wurde, kann das neue Objekt völlig frei geändert werden. Schließlich sind Sie der Eigentümer des Objekts und können in Ihrem Projekt Methoden hinzufügen, vorhandene Methoden überschreiben oder sogar Methoden löschen (oder deren Zugriff verhindern).
Typbasierte Vererbung
Die typbasierte Vererbung funktioniert auf die gleiche Weise wie die objektbasierte Vererbung. Sie erbt von einem vorhandenen Objekt. Die Vererbung hängt hier vom Prototyp ab. Daher wird die typbasierte Vererbung durch Konstruktoren und nicht durch Objekte implementiert. Dies bedeutet, dass auf den Konstruktor des geerbten Objekts zugegriffen werden muss. Im Vergleich zu nativen Typen in JS ist die typbasierte Vererbung am besten geeignet, wenn Entwickler Konstruktoren definieren. Gleichzeitig erfordert die typbasierte Vererbung im Allgemeinen zwei Schritte: zuerst die Prototypenvererbung und dann die Konstruktorvererbung. Bei der Konstruktorvererbung wird das neu erstellte Objekt beim Aufruf des Konstruktors der Superklasse als dieser Wert übergeben. Beispiel:
function Person (name) { this.name = name; }function Author (name) { Person.call(this, name); // 继承构造器} Author.prototype = new Person();
In diesem Code erbt der Autortyp von Person. Der Attributname wird tatsächlich von der Person-Klasse verwaltet, sodass Person.call(this, name) dem Person-Konstruktor ermöglicht, das Attribut weiter zu definieren. Darauf wird der Person-Konstruktor ausgeführt, der auf ein Author-Objekt zeigt, sodass der endgültige Name auf diesem Author-Objekt definiert wird.
Im Vergleich zur objektbasierten Vererbung ist die typbasierte Vererbung beim Erstellen neuer Objekte flexibler. Durch die Definition eines Typs können Sie mehrere Instanzobjekte erstellen, die alle von einer gemeinsamen Oberklasse erben. Der neue Typ sollte die Eigenschaften und Methoden, die er verwenden muss, klar definieren und sie sollten sich völlig von denen in der Oberklasse unterscheiden.
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 Nullvergleiche in der Webentwicklung
Warum Sie die Verwendung globaler Variablen vermeiden müssen Webentwicklung
Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Anwendungsfälle der JS-Objektvererbung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!