Direkt zum Hauptinhalt springen
eLearner.app
Modul 4 · Lektion 1 von 27/14 im Kurs~15 min
Lektionen des Moduls (1/2)

Klassen und Modifikatoren

TypeScript erweitert die Standard-ES6-Klassen um leistungsstarke Funktionen des objektorientierten Paradigmas (OOP) wie statische Typisierung, Zugriffsmodifizierer und abgekürzte Eigenschaften.


Klassen und Zugriffsmodifizierer

In TypeScript können Sie die Sichtbarkeit von Membern, Eigenschaften und Methoden mithilfe von drei Hauptschlüsselwörtern steuern:

  • public (Standard): Das Mitglied ist von überall aus zugänglich.
  • private: Das Mitglied ist nur innerhalb der Klasse zugänglich, die es definiert.
  • protected: Das Mitglied ist innerhalb der Klasse und ihrer Unterklassen zugänglich (Vererbung).
TS
class Animal {
  public name: string;
  private age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  public getAge(): number {
    return this.age;
  }
}

Parametereigenschaften (Parameter Properties)

TypeScript bietet eine abgekürzte Syntax, um Klassenmitglieder direkt im Konstruktor zu deklarieren und zu initialisieren. Durch Voranstellen eines Zugriffsmodifizierers vor den Konstruktorparameter wird die Eigenschaft automatisch erstellt und zugewiesen:

TS
// Diese Syntax macht genau dasselbe wie das vorherige Beispiel!
class Animal {
  constructor(
    public name: string,
    private age: number,
  ) {}
}

Implementierung von Interfaces

Eine Klasse kann mithilfe des Schlüsselworts implements ein oder mehrere Interfaces implementieren. Dies stellt sicher, dass die Klasse einen bestimmten Vertrag einhält, indem sie alle erforderlichen Methoden und Eigenschaften definiert:

TS
interface Flyable {
  fly(altitude: number): void;
}

class Bird implements Flyable {
  constructor(public name: string) {}

  fly(altitude: number): void {
    console.log(`${this.name} sta volando a ${altitude} metri.`);
  }
}

Vererbung und super

TypeScript unterstützt die Klassenvererbung voll und ganz. Eine Klasse kann eine andere Klasse mithilfe des Schlüsselworts extends erweitern. Wenn die Unterklasse einen Konstruktor definiert, muss dieser den Konstruktor der Basisklasse mithilfe der Funktion super() aufrufen, bevor auf this zugegriffen werden kann:

TS
class Person {
  constructor(public name: string) {}
}

class Student extends Person {
  constructor(
    name: string,
    public grade: number,
  ) {
    super(name); // Chiama il costruttore di Person
  }
}

Probier es aus

Esercizio 1: Klasse Car und Modifizierer Private

Übung#ts.m4.l1.e1
Versuche: 0Wird geladen…

Deklariere eine Klasse namens Car. Sie muss eine im Konstruktor definierte readonly-Eigenschaft model (String), eine private Eigenschaft mileage (Zahl, initialisiert mit 0), eine öffentliche Methode drive(miles: number): void, die mileage um miles erhöht, und einen Getter oder eine Methode getMileage(): number besitzen, die mileage zurückgibt.

Editor wird geladen…
Hinweis anzeigen

Verwende private mileage: number = 0;, um die Variable privat zu machen, und constructor(public readonly model: string) {} als Abkürzung.

Lösung nach 3 Versuchen verfügbar

Esercizio 2: Interface Shape und Klasse Circle

Übung#ts.m4.l1.e2
Versuche: 0Wird geladen…

Vervollständige den Code durch Implementierung der Klasse Circle, die das Interface Shape implementiert. Die Klasse muss eine readonly-Eigenschaft radius (Zahl) besitzen, die über den Konstruktor festgelegt wird, und getArea(): number implementieren (wobei Math.PI * radius * radius zurückgegeben wird).

Editor wird geladen…
Hinweis anzeigen

Verwende implements Shape für die Klasse Circle und definiere die Methode getArea(): number.

Lösung nach 3 Versuchen verfügbar

Esercizio 3: Abstrakte Klasse Vehicle und Unterklasse Motorcycle

Übung#ts.m4.l1.e3
Versuche: 0Wird geladen…

Deklariere eine Klasse namens Motorcycle, die die abstrakte Klasse Vehicle erweitert. Sie muss die Methode start() implementieren, um den String 'Motorcycle ' gefolgt von der Marke (this.make) und ' started' zurückzugeben.

Editor wird geladen…
Hinweis anzeigen

Verwende class Motorcycle extends Vehicle und implementere die Methode start(): string, die den korrekten String zurückgibt.

Lösung nach 3 Versuchen verfügbar

Esercizio 4: Parameter Properties und Vererbung

Übung#ts.m4.l1.e4
Versuche: 0Wird geladen…

Erstelle eine Klasse namens Employee, die eine schreibgeschützte Eigenschaft id (Zahl) und eine öffentliche Eigenschaft name (String) über eine Abkürzung im Konstruktor definiert. Erstelle danach eine Klasse Developer, die Employee erweitert und eine öffentliche Eigenschaft department (String) über den Konstruktor hinzufügt.

Editor wird geladen…
Hinweis anzeigen

Verwende super(id, name) im Konstruktor von Developer und verwende public department, um die Eigenschaft über den Konstruktor zu definieren.

Lösung nach 3 Versuchen verfügbar