Erste Schritte mit TypeScript für Anfänger

TypeScript ist eine leistungsstarke Obermenge von JavaScript, die der Sprache statische Typisierung und andere erweiterte Funktionen hinzufügt. Es hilft Entwicklern, Fehler frühzeitig zu erkennen, saubereren Code zu schreiben und große Codebasen effektiver zu verwalten. In diesem Handbuch führen wir Sie durch die Grundlagen von TypeScript und helfen Ihnen beim Einstieg, auch wenn Sie ein absoluter Anfänger sind.

Was ist TypeScript?

TypeScript ist eine von Microsoft entwickelte Open-Source-Programmiersprache. Sie baut auf JavaScript auf und fügt statische Typen hinzu, die dabei helfen können, Fehler zur Kompilierungszeit statt zur Laufzeit zu identifizieren. Dies erleichtert das Schreiben von zuverlässigem und wartbarem Code. TypeScript-Code muss in JavaScript kompiliert werden, bevor er in einem Browser oder einer Node.js-Umgebung ausgeführt werden kann.

Warum TypeScript verwenden?

• Verbesserte Codequalität und frühzeitige Fehlererkennung durch statische Typisierung
• Bessere Tools und Autovervollständigungsfunktionen in modernen IDEs
• Verbesserte Lesbarkeit und Wartbarkeit für große Codebasen
• Unterstützt die neuesten JavaScript-Funktionen und zukünftige Standards

So installieren Sie TypeScript

Bevor Sie TypeScript verwenden können, müssen Sie es auf Ihrem Computer installieren. Sie müssen Node.js und npm (Node Package Manager) installieren. Wenn Sie diese nicht installiert haben, laden Sie sie von der Node.js-Website herunter.

1. Öffnen Sie Ihr Terminal oder Ihre Eingabeaufforderung.
2. Führen Sie den folgenden Befehl aus, um TypeScript global zu installieren:

npm install -g typescript

Dieser Befehl installiert TypeScript global auf Ihrem System und macht es von jedem Ordner aus zugänglich.

Erstellen Ihres ersten TypeScript-Programms

Sobald Sie TypeScript installiert haben, können Sie Ihre erste TypeScript-Datei erstellen. Folgen Sie diesen Schritten:

1. Erstellen Sie einen neuen Ordner für Ihr Projekt und navigieren Sie über das Terminal dorthin:

mkdir my-first-typescript-app
cd my-first-typescript-app

2. Erstellen Sie eine neue TypeScript-Datei mit dem Namen app.ts:

echo "console.log('Hello, TypeScript!');" > app.ts

Dadurch wird eine einfache TypeScript-Datei erstellt, die „Hallo, TypeScript!“ in der Konsole protokolliert.

Kompilieren von TypeScript in JavaScript

TypeScript-Code kann nicht direkt von Browsern oder Node.js ausgeführt werden; er muss zuerst in JavaScript kompiliert werden. Sie können Ihre TypeScript-Datei kompilieren, indem Sie den folgenden Befehl in Ihrem Terminal ausführen:

tsc app.ts

Dieser Befehl generiert eine JavaScript-Datei mit dem Namen app.js im selben Verzeichnis. Sie können die kompilierte JavaScript-Datei jetzt mit Node.js ausführen:

node app.js

Auf der Konsole sollte die Ausgabe Hallo, TypeScript! angezeigt werden.

Grundlegende Typen in TypeScript verstehen

TypeScript führt mehrere grundlegende Typen ein, mit denen Sie die Form und Struktur Ihrer Daten definieren können. Hier sind einige gängige Typen:

• Number: Stellt numerische Werte dar.
• String: Stellt Textwerte dar.
• Boolean: Stellt wahre oder falsche Werte dar.
• Array: Stellt eine Sammlung von Werten desselben Typs dar.
• Tuple: Stellt ein Array mit einer festen Anzahl von Elementen unterschiedlichen Typs dar.
• Enum: Stellt eine Sammlung benannter Konstanten dar.
• Any: Stellt einen dynamischen Typ dar, der beliebige Werte enthalten kann.

Beispiel: Verwenden von Typen in TypeScript

Schauen wir uns ein einfaches Beispiel an, das die Verwendung verschiedener Typen in TypeScript demonstriert:

let age: number = 30;
let name: string = "John Doe";
let isStudent: boolean = true;
let hobbies: string[] = ["Reading", "Gaming", "Traveling"];
let person: [string, number] = ["Jane", 25];

enum Color {
  Red,
  Green,
  Blue,
}

let favoriteColor: Color = Color.Green;

console.log(age, name, isStudent, hobbies, person, favoriteColor);

In diesem Beispiel definieren wir Variablen mit bestimmten Typen wie number, string, boolean, array, tuple und enum. Der TypeScript-Compiler stellt sicher, dass den Variablen die richtigen Typen zugewiesen werden, und bietet so eine Sicherheitsebene, die Vanilla JavaScript nicht bietet.

Abschluss

TypeScript ist eine großartige Wahl für Entwickler, die robusteren und wartungsfreundlicheren Code schreiben möchten. Durch das Hinzufügen statischer Typen zu JavaScript kann TypeScript Ihnen helfen, Fehler frühzeitig zu erkennen und eine bessere Tool-Unterstützung bereitzustellen. In diesem Tutorial haben Sie die Grundlagen von TypeScript kennengelernt, wie man es installiert, ein einfaches Programm schreibt und einige seiner grundlegenden Typen verwendet. Wenn Sie sich weiter mit TypeScript befassen, werden Sie viele weitere leistungsstarke Funktionen entdecken, die Ihren Entwicklungsworkflow verbessern können.