Heim >Web-Frontend >js-Tutorial >Lernen Sie Typescript mit mir – Teil 2

Lernen Sie Typescript mit mir – Teil 2

Patricia Arquette
Patricia ArquetteOriginal
2025-01-02 19:41:43892Durchsuche

Learn Typescript with me - Part 2

In unserem vorherigen Artikel haben wir die Grundlagen des Typoskripts kennengelernt. Wenn Sie es noch nicht gelesen haben, lesen Sie es bitte, bevor Sie dies lesen.

1- Lernen Sie Typoskript mit mir - 1

ENUM

Aufzählungen bieten eine Möglichkeit, eine Reihe benannter Konstanten zu definieren. Standardmäßig beginnen Enum-Werte mit 0, wir können sie jedoch überschreiben.

enum Color { Red = "RED", Green = "GREEN", Blue = "BLUE", };

const getColorMessage = (color: Color): string => { 
      return You selected ${color};
 }; 

console.log(getColorMessage(Color.Red));

Arrays

Arrays in Typoskript ermöglichen es Ihnen, Sammlungen von Elementen desselben Typs zu definieren. Sie können sie sich wie eine Art Liste vorstellen, auch wenn sie in Python als Listentyp bezeichnet werden.

const numbers: number[] = [1, 2, 3, 4];

numbers.push(5);

console.log(numbers);

now if I try to add a string in numbers array typescript will complain

number.push("five") // type string is not assignable to type number

Tupel

Tupel sind ein spezieller Array-Typ in TypeScript, mit dem Sie ein Array mit festen Größen und Typen definieren können. Tupel werden verwendet, wenn wir die Form unserer Daten genau kennen. Durch die Verwendung von Tupeln erzielen wir dann Leistungssteigerungen beim Lesen der Daten.

const user: [number, string] = [1, "Alice"];

console.log(user);

Objekt

Mit Objekten in Typoskript können Sie die Struktur eines Objekts mit Typen definieren. Wir können ein Objekt wie folgt eingeben, mehr zu Objekten im Typ-Alias-Thema

const user: { id: number; name: string } = { id: 1, name: "Alice" }; 

console.log(user.name);

Geben Sie Alias ​​ein

Typaliase ermöglichen es Ihnen, benutzerdefinierte Typen in Typescript zu definieren, um die Wiederverwendung und Lesbarkeit des Codes zu verbessern. Jetzt können wir unser Objekt als Type Alias ​​UserType

eingeben

Hinweis: Verwenden Sie in Ihren echten Projekten keine Wörter wie Typ.

type UserType = { id: number; name: string; };

const user: UserType = { id: 1, name: "Alice" };

console.log(user.id);

Optionale Eigenschaften

Mit optionalen Eigenschaften können Sie Objekteigenschaften definieren, die möglicherweise vorhanden sind oder nicht. Wenn wir in unserem vorherigen Beispiel davon ausgegangen sind, dass der Benutzer nur eine ID und einen Namen hat, kann dies der Fall sein oder auch nicht. Können wir hinzufügen? vorher: um anzuzeigen, dass es sich um eine optionale Eigenschaft handelt

type UserType = { id: number; name?: string; };

const user: User = { id: 1 };

console.log(user.name ?? "Name not provided");

Verengung / Typschutz

Mit dem Typschutz können Sie den Typ eines Werts innerhalb eines bestimmten Codeblocks eingrenzen. Da wir also wissen, dass der Name unseres Benutzers eine optionale Eigenschaft ist, wird, wenn wir jetzt versuchen, den Namen des Benutzers auszugeben, undefiniert angezeigt, was wir unseren Kunden nicht zeigen möchten. Daher stellen wir sicher, dass der Benutzername eine Zeichenfolge ist, bevor wir ihn anzeigen es

if (typeof user.name == 'undefined') {
   console.log("Welcome", user.name)
}  else {
   console.log("Welcome Guest")
}

Okay Leute, in unserem nächsten Artikel werden wir damit beginnen, Funktionen und Typzusicherungen zu behandeln.

Dänischer Ali

Das obige ist der detaillierte Inhalt vonLernen Sie Typescript mit mir – Teil 2. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn