Generische Arrays

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

Arrays und Generics arbeiten in TypeScript wunderbar zusammen. Als Sie vorhin etwas über typisierte Arrays gelernt haben, haben Sie die T[]-Syntax verwendet, um anzugeben, dass ein Array nur Elemente eines bestimmten Typs enthalten kann. Generics bieten Ihnen eine weitere Möglichkeit, dasselbe Konzept auszudrücken.

TypeScript bietet eine alternative Syntax für typisierte Arrays im Format Array<T> an:

// Diese beiden Deklarationen sind gleichwertig:
let numbers1: number[] = [1, 2, 3];
let numbers2: Array<number> = [1, 2, 3];

Die Array<T>-Syntax ist besonders nützlich, wenn man mit generischen Funktionen arbeitet, die auf Arrays operieren. Sie macht die generische Natur Ihres Codes expliziter und lesbarer, insbesondere wenn Sie Funktionen erstellen, die mit Arrays eines beliebigen Typs arbeiten können, während die Typsicherheit gewahrt bleibt.

Teste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

Teste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

Teste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

Aufgabe

Einfach

Erstellen Sie eine generische Funktion namens getFirstElement, die ein Array eines beliebigen Typs entgegennimmt und das erste Element oder undefined zurückgibt, wenn das Array leer ist.

Die Funktion sollte:

Einen generischen Typparameter T verwenden
Einen Parameter namens arr vom Typ Array<T> akzeptieren
Das erste Element vom Typ T oder undefined zurückgeben
Eine explizite Rückgabetyp-Annotation von T | undefined haben

Erstellen Sie die folgenden Arrays unter Verwendung der Array<T>-Syntax:

stringArray vom Typ Array<string>, das ["apple", "banana", "cherry"] enthält
numberArray vom Typ Array<number>, das [10, 20, 30, 40] enthält
booleanArray vom Typ Array<boolean>, das [true, false, true] enthält
emptyStringArray vom Typ Array<string>, das leer ist

Testen Sie Ihre Funktion und geben Sie die folgenden Ausgaben aus:

Geben Sie das Ergebnis des Aufrufs von getFirstElement mit stringArray aus
Geben Sie das Ergebnis des Aufrufs von getFirstElement mit numberArray aus
Geben Sie das Ergebnis des Aufrufs von getFirstElement mit booleanArray aus
Geben Sie das Ergebnis des Aufrufs von getFirstElement mit emptyStringArray aus
Geben Sie das Ergebnis des Aufrufs von getFirstElement mit einem neuen Array<string>, das ["single"] enthält, aus

Spickzettel

TypeScript bietet zwei gleichwertige Syntaxen für typisierte Arrays:

// Diese beiden Deklarationen sind gleichwertig:
let numbers1: number[] = [1, 2, 3];
let numbers2: Array<number> = [1, 2, 3];

Die Array<T>-Syntax ist besonders nützlich bei der Arbeit mit generischen Funktionen, die auf Arrays operieren, da sie die generische Natur Ihres Codes expliziter und lesbarer macht und gleichzeitig die Typsicherheit bewahrt.

Probier es selbst

// TODO: Schreiben Sie hier Ihren Code
// Erstellen Sie die generische Funktion getFirstElement

// Erstellen Sie die erforderlichen Arrays mit der Array<T>-Syntax

// Testen Sie die Funktion und geben Sie die Ergebnisse aus

Teste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.