Wie implementiert JavaScript die Vererbung?

JavaScript ist eine objektorientierte Sprache und Vererbung ist ein wichtiges Merkmal der objektorientierten Programmierung. In JavaScript gibt es viele Möglichkeiten, die Vererbung zu implementieren. In diesem Artikel werden einige der gängigsten Methoden vorgestellt.

1. Prototypkettenvererbung

Die Prototypkettenvererbung ist die grundlegendste und am häufigsten verwendete Vererbungsmethode in JavaScript. Durch die Vererbung der Prototypenkette können Unterklassen die Eigenschaften und Methoden der übergeordneten Klasse erben.

Die Implementierungsmethode der Prototypkettenvererbung lautet wie folgt:

function Parent(name) {
    this.name = name;
    this.colors = ['red', 'green', 'blue'];
}

Parent.prototype.sayName = function() {
    console.log(this.name);
};

function Child(name, age) {
    this.age = age;
    Parent.call(this, name);
}

Child.prototype = new Parent();
Child.prototype.constructor = Child;

var child1 = new Child('Tom', 18);
child1.colors.push('black');
console.log(child1.colors);  // ['red', 'green', 'blue', 'black']
child1.sayName();  // Tom

var child2 = new Child('Jerry', 20);    
console.log(child2.colors);  // ['red', 'green', 'blue']
child2.sayName();  // Jerry

Im obigen Code definieren wir zunächst eine übergeordnete Klasse Parent und eine untergeordnete Klasse Child. In Child verwenden wir Parent.call(this, name), um den Konstruktor der übergeordneten Klasse aufzurufen, und verweisen den Prototyp von Child über Child.prototype = new Parent() auf Parent, wodurch die Vererbung realisiert wird. Am Ende haben wir zwei Unterklasseninstanzen erstellt, child1 und child2, und die Auswirkung der Vererbung überprüft.

Der Vorteil der Prototypenkettenvererbung besteht darin, dass sie einfach zu implementieren und leicht zu verstehen ist. Sein Nachteil liegt jedoch auch auf der Hand, nämlich dass die Referenztypeigenschaften im Prototypobjekt von allen Instanzen gemeinsam genutzt werden.

2. Konstruktorvererbung

Die Konstruktorvererbung ist eine relativ einfach zu verstehende Vererbungsmethode. Sie erreicht die Vererbung durch den Aufruf des Konstruktors der übergeordneten Klasse.

Die Implementierungsmethode der Konstruktorvererbung lautet wie folgt:

function Parent(name) {
    this.name = name;
    this.colors = ['red', 'green', 'blue'];
}

Parent.prototype.sayName = function() {
    console.log(this.name);
};

function Child(name, age) {
    Parent.call(this, name);
    this.age = age;
}

var child1 = new Child('Tom', 18);
child1.colors.push('black');
console.log(child1.colors);  // ['red', 'green', 'blue', 'black']
child1.sayName();  // TypeError: child1.sayName is not a function 

var child2 = new Child('Jerry', 20);    
console.log(child2.colors);  // ['red', 'green', 'blue']
child2.sayName();  // TypeError: child2.sayName is not a function

Im obigen Code verwenden wir Parent.call(this, name) im Unterklassenkonstruktor Child, um den Konstruktor der übergeordneten Klasse aufzurufen und diesen somit auf die Unterklasseninstanz zu verweisen Vererbung ist implementiert. Da jedoch die Konstruktorvererbung die Methoden im Prototyp der übergeordneten Klasse nicht erbt, können wir die Methoden im Prototyp der übergeordneten Klasse nicht direkt in der Unterklasse aufrufen.

Der Vorteil der Konstruktorvererbung besteht darin, dass das Problem vermieden wird, dass Referenztypattribute von allen Instanzen in der Prototypkettenvererbung gemeinsam genutzt werden. Der Nachteil liegt jedoch auch auf der Hand, nämlich dass Methoden im Prototyp der übergeordneten Klasse nicht vererbt werden können.

3. Kombinationsvererbung

Die Kombinationsvererbung ist die am häufigsten verwendete Vererbungsmethode in JavaScript. Sie ist eine Möglichkeit, die Vererbung von Prototypenketten und die Vererbung von Konstruktoren zu kombinieren und so die jeweiligen Mängel zu beheben.

Die Implementierungsmethode der kombinierten Vererbung lautet wie folgt:

function Parent(name) {
    this.name = name;
    this.colors = ['red', 'green', 'blue'];
}

Parent.prototype.sayName = function() {
    console.log(this.name);
};

function Child(name, age) {
    Parent.call(this, name);
    this.age = age;
}

Child.prototype = new Parent();
Child.prototype.constructor = Child;

var child1 = new Child('Tom', 18);
child1.colors.push('black');
console.log(child1.colors);  // ['red', 'green', 'blue', 'black']
child1.sayName();  // Tom

var child2 = new Child('Jerry', 20);    
console.log(child2.colors);  // ['red', 'green', 'blue']
child2.sayName();  // Jerry

Im obigen Code verwenden wir Parent.call(this, name) im Unterklassenkonstruktor Child, um den Konstruktor der übergeordneten Klasse aufzurufen und diesen auf die zu erreichende Unterklasseninstanz zu verweisen Geerbt. Gleichzeitig übergeben wir Child.prototype = new Parent() im Prototyp der Unterklasse, damit die Unterklasse den Prototyp der übergeordneten Klasse erbt und dadurch die Methoden im Prototyp der übergeordneten Klasse erbt.

Der Vorteil der kombinierten Vererbung besteht darin, dass die Vererbungsmethode nicht nur die Methoden im Prototyp der übergeordneten Klasse erben kann, sondern auch das Problem vermieden wird, dass Referenztypattribute von allen Instanzen in der Prototypkettenvererbung gemeinsam genutzt werden. Der Nachteil besteht jedoch darin, dass der Konstruktor der übergeordneten Klasse zweimal aufgerufen wird, wodurch eine gewisse Menge an Speicherplatz verschwendet wird.

4. Parasitäre Kombinationsvererbung

Parasitische Kombinationsvererbung ist eine Optimierungsmethode für die Kombinationsvererbung. Sie vermeidet das Problem, den Konstruktor der übergeordneten Klasse im Unterklassenprototyp mehrmals aufzurufen, wodurch der Speicheraufwand verringert wird.

Die Implementierungsmethode der Vererbung parasitärer Kombinationen lautet wie folgt:

function Parent(name) {
    this.name = name;
    this.colors = ['red', 'green', 'blue'];
}

Parent.prototype.sayName = function() {
    console.log(this.name);
};

function Child(name, age) {
    Parent.call(this, name);
    this.age = age;
}

Child.prototype = Object.create(Parent.prototype, {
    constructor: {
        value: Child,
        enumerable: false,
        writable: true,
        configurable: true
    }
});

var child1 = new Child('Tom', 18);
child1.colors.push('black');
console.log(child1.colors);  // ['red', 'green', 'blue', 'black']
child1.sayName();  // Tom

var child2 = new Child('Jerry', 20);    
console.log(child2.colors);  // ['red', 'green', 'blue']
child2.sayName();  // Jerry

Im obigen Code verwenden wir die Methode Object.create() im Prototyp der Unterklasse, um eine Kopie des Prototyps der übergeordneten Klasse zu erstellen, und übergeben die zweite Methode von Object.create() Der Parameter überschreibt das Konstruktorattribut des Unterklassenprototyps, sodass er auf die Unterklasse selbst verweist. Da die Methode Object.create() den Konstruktor der übergeordneten Klasse nicht aufruft, wird das Problem vermieden, dass der Konstruktor der übergeordneten Klasse im Prototyp der untergeordneten Klasse mehrmals aufgerufen wird.

Der Vorteil der parasitären Kombinationsvererbung besteht darin, dass sie nicht nur die Methoden im Prototyp der übergeordneten Klasse erbt, sondern auch das Problem vermeidet, dass der Konstruktor der übergeordneten Klasse im Prototyp der untergeordneten Klasse mehrmals aufgerufen wird. Der Nachteil besteht darin, dass die Implementierung komplizierter ist.

Kurz gesagt, es gibt viele Möglichkeiten, die Vererbung in JavaScript zu implementieren, und jede Methode hat ihre eigenen Vor- und Nachteile. In der tatsächlichen Entwicklung sollten wir die geeignete Vererbungsmethode entsprechend der spezifischen Situation auswählen.

Das obige ist der detaillierte Inhalt vonWie implementiert JavaScript die Vererbung?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!