Wie kann die Vererbung in es6 implementiert werden?

In es6 können Sie das Schlüsselwort „class“ zusammen mit dem Schlüsselwort „extends“ verwenden, um die Vererbung zu implementieren. Das Schlüsselwort class wurde in ES6 eingeführt, um eine Klasse zu deklarieren, und eine Klasse (Klasse) kann die Eigenschaften und Methoden der übergeordneten Klasse durch Erweiterungen erben. Die Syntax lautet „Name der Klassenunterklasse erweitert den Namen der übergeordneten Klasse {...};“.

Die Betriebsumgebung dieses Tutorials: Windows 7-System, ECMAScript Version 6, Dell G3-Computer.

In es6 können Sie das Schlüsselwort „class“ mit dem Schlüsselwort „extends“ verwenden, um die Vererbung zu implementieren.

In ES6 wird Klasse (class) als Vorlage für Objekte eingeführt, und Klassen können über das Schlüsselwort „class“ definiert werden.

es6-Vererbung

Klasse kann über das Schlüsselwort „Extens“ geerbt werden

class Animal {}
class Cat extends Animal { };

Der obige Code definiert eine Cat-Klasse, die alle Attribute und Methoden in der Animal-Klasse über das Schlüsselwort „Extens“ erbt. Da jedoch kein Code bereitgestellt wird, sind die beiden Klassen genau gleich, was dem Kopieren einer Animal-Klasse entspricht. Als nächstes fügen wir Code in Cat ein.

class Cat extends Animal {
    constructor(name, age, color) {
        // 调用父类的constructor(name, age)
        super(name, age);
        this.color = color;
    }
    toString() {
        return this.color + ' ' + super.toString(); // 调用父类的toString()
    }
}

Das Schlüsselwort super kommt sowohl in der Konstruktormethode als auch in der toString-Methode vor. Es stellt hier den Konstruktor der übergeordneten Klasse dar und wird zum Erstellen eines neuen this-Objekts der übergeordneten Klasse verwendet.

Es ist zu beachten, dass das Schlüsselwort „class“ lediglich Syntaxzucker für den Prototyp ist und die JavaScript-Vererbung weiterhin basierend auf dem Prototyp implementiert wird.

class Pet {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  showName() {
    console.log("调用父类的方法");
    console.log(this.name, this.age);
  }
}

// 定义一个子类
class Dog extends Pet {
  constructor(name, age, color) {
    super(name, age); // 通过 super 调用父类的构造方法
    this.color = color;
  }

  showName() {
    console.log("调用子类的方法");
    console.log(this.name, this.age, this.color);
  }
}

Vorteile:

• Klar und bequem
  

Nachteile:

• Nicht alle Browser unterstützen Klassen.

【Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend】

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