5.1 Klassen-Deklaration
Mit der Einführung von ECMAScript 6 (ES6) in JavaScript wurde eine neue Struktur zur Erstellung von Objekten und Verwaltung der Vererbung eingeführt — das Schlüsselwort class. Klassen bieten eine bequemere und klarere Syntax zur Erstellung von Objekten und zur Arbeit mit Prototypen.
Klassen in JavaScript — sind syntaktischer Zucker über dem bestehenden Prototyp-Vererbungsmodell. Sie machen die Erstellung und Verwaltung von Objekten verständlicher und strukturierter.
Klassen-Deklaration
Eine Klasse in JavaScript wird mit dem Schlüsselwort class deklariert, gefolgt vom Klassennamen. Der Klassenkörper ist in geschweifte Klammern {} eingeschlossen.
Beispiel:
class Person {
// Klassenmethode
greet() {
console.log('Hello!');
}
}
// Erstellen einer Instanz der Klasse
const person = new Person();
person.greet(); // Gibt aus: Hello!
Klassen-Ausdruck
Klassen können sowohl durch Deklaration als auch durch Ausdruck deklariert werden. Klassenausdrücke können benannt oder anonym sein.
Beispiel eines benannten Klassen-Ausdrucks:
const Person = class PersonClass {
greet() {
console.log('Hello!');
}
};
const person = new Person();
person.greet(); // Gibt aus: Hello!
Beispiel eines anonymen Klassen-Ausdrucks:
const Person = class {
greet() {
console.log('Hello!');
}
};
const person = new Person();
person.greet(); // Gibt aus: Hello!
5.2 Felder und Methoden von Klassen
Klassen-Eigenschaften
Klassen-Eigenschaften in ES6 konnten nur innerhalb des Konstruktors deklariert werden. In neueren JavaScript-Versionen (ES2022) wurden jedoch Klassenfelder eingeführt, die es ermöglichen, Eigenschaften außerhalb des Konstruktors zu deklarieren.
Beispiel für die Verwendung von Eigenschaften im Konstruktor:
class User {
constructor(username, email) {
this.username = username;
this.email = email;
}
}
const user = new User('john_doe', 'john@example.com');
console.log(user.username); // "john_doe"
console.log(user.email); // "john@example.com"
Beispiel für die Verwendung von Klassenfeldern (ES2022):
class User {
username = 'default_username';
email = 'default@example.com';
constructor(username, email) {
this.username = username;
this.email = email;
}
}
const user = new User('john_doe', 'john@example.com');
console.log(user.username); // "john_doe"
console.log(user.email); // "john@example.com"
Erklärung:
- Im ersten Beispiel werden die Eigenschaften
usernameundemailinnerhalb des Konstruktors deklariert und initialisiert - Im zweiten Beispiel werden die Eigenschaften
usernameundemailaußerhalb des Konstruktors als Klassenfelder deklariert
Klassen-Methoden
Eine Klasse kann Methoden enthalten, die innerhalb des Klassenkörpers definiert werden. Diese Methoden werden automatisch dem Prototyp der erstellten Objekte hinzugefügt.
Beispiel für Klassen-Methoden:
class Animal {
speak() {
console.log('Animal spricht');
}
eat() {
console.log('Animal isst');
}
}
const animal = new Animal();
animal.speak(); // Gibt aus: Animal spricht
animal.eat(); // Gibt aus: Animal isst
3.3 Beispiele für die Verwendung von Klassen
Erstellung komplexer Objekte
Klassen ermöglichen die Erstellung komplexer Objekte mit verschiedenen Methoden und Eigenschaften.
Beispiel:
class Car {
constructor(brand, model) {
this.brand = brand;
this.model = model;
}
startEngine() {
console.log(`${this.brand} ${this.model} Motor gestartet.`);
}
stopEngine() {
console.log(`${this.brand} ${this.model} Motor gestoppt.`);
}
}
const myCar = new Car('Toyota', 'Camry');
myCar.startEngine(); // Gibt aus: Toyota Camry Motor gestartet.
myCar.stopEngine(); // Gibt aus: Toyota Camry Motor gestoppt.
GO TO FULL VERSION