Kombinieren von Typ-Aliasen

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

Einer der leistungsfähigsten Aspekte von Typ-Aliasen ist ihre Fähigkeit, kombiniert und wiederverwendet zu werden, um anspruchsvollere Typdefinitionen zu erstellen. Anstatt komplexe Typen jedes Mal von Grund auf neu zu definieren, können Sie diese aufbauen, indem Sie kleinere, fokussierte Typ-Aliase miteinander kombinieren.

Dieser Ansatz fördert die Wiederverwendbarkeit von Code und macht Ihre Typdefinitionen wartungsfreundlicher. Wenn Sie einen Basistyp aktualisieren müssen, erben alle zusammengesetzten Typen, die ihn verwenden, automatisch die Änderungen:

type Email = string;
type Phone = number;

type Contact = {
  name: string;
  email: Email;
  phone: Phone;
};

Sie können auch Typ-Aliase innerhalb von Union-Typen kombinieren, um flexible Datenstrukturen zu erstellen. Dies ist besonders nützlich, wenn eine Objekteigenschaft verschiedene Formate akzeptieren kann:

type ContactMethod = Email | Phone;

type User = {
  id: number;
  preferredContact: ContactMethod;
};

Dieser kompositionelle Ansatz macht Ihren Code ausdrucksstärker und leichter verständlich. Anstatt generische Typen wie string oder number zu sehen, verstehen andere Entwickler den beabsichtigten Zweck sofort durch aussagekräftige Typnamen wie Email und Phone.

Aufgabe

Einfach

Erstellen Sie einen Typ-Alias namens Username für den Typ string.

Erstellen Sie einen Typ-Alias namens UserAge für den Typ number.

Erstellen Sie einen Typ-Alias namens ContactMethod, der Username und UserAge mithilfe eines Union-Typs kombiniert.

Erstellen Sie einen Typ-Alias namens UserProfile für ein Objekt mit den folgenden Eigenschaften:

id vom Typ number
displayName vom Typ Username
preferredContact vom Typ ContactMethod

Erstellen Sie einen Typ-Alias namens AdminProfile, der UserProfile mit einem zusätzlichen Objekttyp kombiniert, der eine Eigenschaft permissions vom Typ string enthält, unter Verwendung von Intersection-Typen.

Erstellen Sie nun die folgenden Variablen:

Erstellen Sie eine Variable namens regularUser vom Typ UserProfile mit der id 1, dem displayName "john_doe" und dem preferredContact "john_doe"
Erstellen Sie eine Variable namens systemAdmin vom Typ AdminProfile mit der id 2, dem displayName "admin", dem preferredContact 25 und den permissions "full_access"

Erstellen Sie eine Funktion namens getContactInfo, die einen Parameter namens contact vom Typ ContactMethod akzeptiert und einen string zurückgibt. Verwenden Sie einen Type Guard, um den Typ zu prüfen und Folgendes zurückzugeben:

Wenn es ein String ist: "Contact: [contact]"
Wenn es eine Nummer ist: "Age: [contact]"

Geben Sie die folgenden Ausgaben in separaten Zeilen aus:

Rufen Sie getContactInfo mit regularUser.preferredContact auf und geben Sie das Ergebnis aus
Rufen Sie getContactInfo mit systemAdmin.preferredContact auf und geben Sie das Ergebnis aus
Geben Sie systemAdmin.permissions aus

Probier es selbst

// TODO: Schreiben Sie Ihren Code hier

// Erstellen Sie Typ-Aliase für Username, UserAge, ContactMethod, UserProfile und AdminProfile

// Erstellen Sie die Variablen regularUser und systemAdmin

// Erstellen Sie die Funktion getContactInfo

// Geben Sie die erforderlichen Ausgaben aus