Generische Interfaces

Teil des Abschnitts Einführung in TypeScript der JavaScript-Journey von Coddy. Lektion 61 von 73.

So wie du generische Funktionen erstellen kannst, kannst du auch generische Schnittstellen erstellen. Dadurch kannst du die Struktur eines Objekts definieren und gleichzeitig bestimmte Eigenschaftstypen flexibel und wiederverwendbar halten.

So erstellst du eine generische Schnittstelle mit derselben Syntax für Typparameter:

interface Container {
  value: T;
  isEmpty: boolean;
}

Das <T> nach dem Namen des Interfaces erstellt einen Typparameter, der in der gesamten Interface-Definition verwendet werden kann. In diesem Beispiel hat die Eigenschaft value den Typ, den du bei der Verwendung des Interfaces angibst, während isEmpty ein fester boolean-Typ bleibt.

Wenn du eine generische Schnittstelle verwendest, gibst du den konkreten Typ in spitzen Klammern an:

const stringContainer: Container = {
  value: "hello",
  isEmpty: false
};

const numberContainer: Container = {
  value: 42,
  isEmpty: false
};

Aufgabe

Einfach

Erstelle eine generische Schnittstelle namens Result, die Daten beliebigen Typs zusammen mit Erfolgsinformationen enthalten kann.

Die Schnittstelle sollte zwei Eigenschaften haben:

success vom Typ boolean
data vom Typ T (der generische Typparameter)

Erstelle die folgenden Objekte mithilfe deiner generischen Schnittstelle:

stringResult vom Typ Result<string> mit success: true und data: "Operation completed"
numberResult vom Typ Result<number> mit success: true und data: 42
booleanResult vom Typ Result<boolean> mit success: false und data: false
arrayResult vom Typ Result<string[]> mit success: true und data: ["item1", "item2", "item3"]

Erstelle eine generische Funktion namens processResult, die:

einen generischen Typparameter T verwendet
einen Parameter result vom Typ Result<T> entgegennimmt
eine String-Nachricht zurückgibt
wenn success true ist, "Success: [data]" zurückgibt
wenn success false ist, "Failed: [data]" zurückgibt

Gib die folgenden Ausgaben aus:

Gib das Ergebnis des Aufrufs von processResult mit stringResult aus
Gib das Ergebnis des Aufrufs von processResult mit numberResult aus
Gib das Ergebnis des Aufrufs von processResult mit booleanResult aus
Gib das Ergebnis des Aufrufs von processResult mit arrayResult aus
Gib stringResult.data aus

Probier es selbst

// TODO: Schreibe deinen Code hier

// Erstelle das generische Result-Interface


// Erstelle die Objekte unter Verwendung des Result-Interfaces


// Erstelle die generische processResult-Funktion


// Gib die erforderlichen Ausgaben aus