JavaScript-Klassen

Klassen sind Vorlagen zum Erstellen von Objekten.

Wir verwenden das Schlüsselwort class, um eine Klasse zu erstellen, und der Klassenkörper befindet sich innerhalb eines Paares geschweifter Klammern.{}Darin können wir innerhalb der geschweiften Klammern{}die Positionen von Klassenmitgliedern wie Methoden oder Konstruktoren definieren.

Jede Klasse enthält eine spezielle Methode.constructor()Sie ist der Konstruktor der Klasse. Diese Methode wird verwendet, um ein Objekt zu erstellen und zu initialisieren, das vonclasserstellte Objekt.

Die Syntax zum Erstellen einer Klasse lautet wie folgt:

class ClassName { constructor() { ... } }

Beispiel:

Beispiel

class Example { constructor(name, url) { this.name = name; this.url = url; } }

Das obige Beispiel erstellt eine Klasse namens "Example".

Die Klasse initialisiert zwei Eigenschaften: "name" und "url".

Browser-Unterstützung

Die Zahlen in der Tabelle geben die erste Browserversion an, die diese Funktion unterstützt.

Chrome 49 Edge 12 Firefox 45 Safari 9 Opera 36
März 2016 Juli 2015 März 2016 Okt. 2015 März 2016

Klassen verwenden

Nachdem wir eine Klasse definiert haben, können wir dasnewSchlüsselwort verwenden, um Objekte zu erstellen:

Beispiel

class Example { constructor(name, url) { this.name = name; this.url = url; } } let site = new Example("Example", "https://www.example.com");

Selbst ausprobieren »

Beim Erstellen eines Objekts wird die Konstruktormethode automatisch aufgerufen.constructor()。

Klassenausdrücke

Klassenausdrücke sind eine weitere Möglichkeit, eine Klasse zu definieren. Klassenausdrücke können benannt oder unbenannt sein. Der Name eines benannten Klassenausdrucks ist lokal für den Klassenkörper.

Beispiel

//Unbenannte/anonyme Klasse let Example = class { constructor(name, url) { this.name = name; this.url = url; } }; console.log(Example.name); // Ausgabe: "Example" //Benannte Klasse let Example = class Example2 { constructor(name, url) { this.name = name; this.url = url; } }; console.log(Example.name); //Ausgabe: "Example2"

Konstruktormethode

Die Konstruktormethode ist eine spezielle Methode:

  • Die Konstruktormethode heißt constructor().
  • Die Konstruktormethode wird beim Erstellen eines neuen Objekts automatisch ausgeführt.
  • Die Konstruktormethode wird verwendet, um Objekteigenschaften zu initialisieren.
  • Wenn du keine Konstruktormethode definierst, fügt JavaScript automatisch eine leere Konstruktormethode hinzu.

Klassenmethoden

Wir verwenden das Schlüsselwortclass, um eine Klasse zu erstellen, und können eineconstructor()-Methode hinzufügen und dann beliebig viele Methoden hinzufügen.

class ClassName { constructor() { ... } method_1() { ... } method_2() { ... } method_3() { ... } }

Im folgenden Beispiel erstellen wir eine "age"-Methode, die das Alter der Website zurückgibt:

Beispiel

class Example { constructor(name, year) { this.name = name; this.year = year; } age() { let date = new Date(); return date.getFullYear() - this.year; } } let example = new Example("Example", 2018); document.getElementById("demo").innerHTML = "Example" + example.age() + "Jahre alt.";

Selbst ausprobieren »

Wir können auch Parameter an Klassenmethoden übergeben:

Beispiel

class Example { constructor(name, year) { this.name = name; this.year = year; } age(x) { return x - this.year; } } let date = new Date(); let year = date.getFullYear(); let example = new Example("Example", 2020); document.getElementById("demo").innerHTML= "Example" + example.age(year) + "Jahre alt.";

Selbst ausprobieren »

Strenger Modus "use strict"

Die Rümpfe von Klassendeklarationen und Klassenausdrücken werden im strengen Modus ausgeführt. Zum Beispiel werden Konstruktoren, statische Methoden, Prototypmethoden, Getter und Setter alle im strengen Modus ausgeführt.

Wenn Sie den strengen Modus nicht einhalten, tritt ein Fehler auf:

Beispiel

class Example { constructor(name, year) { this.name = name; this.year = year; } age() { //date = new Date(); // Fehler let date = new Date(); //Korrekt return date.getFullYear() - this.year; } }

Selbst ausprobieren »

Das folgende Beispiel verwendet eine nicht deklarierte Variable in einer Klasse:

Weitere Informationen zum Strict Mode finden Sie unter:JavaScript Strict Mode (use strict)

Referenz

Klassenmethoden

Methode Beschreibung
constructor() Konstruktor, wird zum Erstellen und Initialisieren einer Klasse verwendet.

Klassenschlüsselwörter

Schlüsselwort Beschreibung
extends Eine Klasse erben
static Definiert eine statische Methode in einer Klasse.
super Ruft die Konstruktormethode der Elternklasse auf.
Andere Erweiterungen