JavaScript-Vererbung: Child.prototype = Parent.Prototype vs. Child.prototype = new Parent() – Welcher Ansatz ist besser?

Subtile Nuancen der Javascript-Vererbung: Child.prototype = Parent.Prototype vs. Child.prototype = new Parent()

In Javascript, Vererbung wird häufig mithilfe des Prototypmechanismus implementiert. Der Hauptunterschied zwischen diesen beiden gängigen Ansätzen liegt in ihrer Auswirkung auf die Proto-Eigenschaft des untergeordneten Objekts.

Bei Verwendung von Child.prototype = Parent.Prototype verweisen sowohl der untergeordnete als auch der übergeordnete Prototyp auf dasselbe Objekt. Dies bedeutet, dass sich alle am Prototyp des Kindes vorgenommenen Änderungen auch auf den Prototyp des Elternteils auswirken.

Bei Verwendung von Child.prototype = new Parent() wird jedoch ein neues Objekt erstellt, das vom Prototyp des Elternteils erbt. Dadurch wird sichergestellt, dass der Prototyp des untergeordneten Elements vom Prototyp des übergeordneten Elements isoliert ist, sodass unabhängige Änderungen ohne Auswirkungen auf das übergeordnete Element möglich sind.

Auswirkungen auf Instanzeigenschaften

Im bereitgestellten Beispiel das Problem entsteht beim Festlegen von Instanzeigenschaften innerhalb des untergeordneten Konstruktors:

this.hitBox.width = oImg.width;
this.hitBox.height = oImg.height;

Mit Child.prototype = Parent.Prototype, diese Eigenschaften werden direkt zum Prototyp des Kindes hinzugefügt, der auch der Prototyp des Elternteils ist. Infolgedessen zeigt das console.log(this) im untergeordneten Konstruktor proto: Spaceship an, da der Prototyp jetzt als Spaceship festgelegt ist.

Lösung: Verwenden von Object.create

Um dieses Problem zu vermeiden, wird empfohlen, Object.create(Parent.prototype) zu verwenden:

Spaceship.prototype = Object.create(GameObject.prototype);

Diese Strategie erstellt ein neues Objekt, das erbt vom Prototyp des übergeordneten Elements und behält gleichzeitig seinen eigenen unabhängigen Prototyp bei. Dem Prototyp des untergeordneten Elements hinzugefügte Instanzeigenschaften wirken sich nicht auf die des übergeordneten Elements aus.

Vergleich mit der Instanz von

Bei der Überprüfung der Vererbung mithilfe der Objektinstanz von GameObject ist es wichtig, dies zu tun Beachten Sie, dass Child.prototype = Parent.Prototype diesen Test nicht bestehen wird, da der Prototyp des Kindes keine Instanz von GameObject ist. Im Gegensatz dazu wird Child.prototype = new Parent() den Test wie erwartet bestehen.

Empfehlung

Für eine robuste und isolierte Vererbung in Javascript wird es im Allgemeinen bevorzugt Verwenden Sie Child.prototype = Object.create(Parent.prototype) anstelle von Child.prototype = Parent.Prototype.

Das obige ist der detaillierte Inhalt vonJavaScript-Vererbung: Child.prototype = Parent.Prototype vs. Child.prototype = new Parent() – Welcher Ansatz ist besser?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!