Willkommen zu einem vollständigen TypeScript-Tutorial! Anders als die "React für Profis"- und "React Native für Profis"-Serien, die TypeScript nur im ZUSAMMENSPIEL mit einem Framework zeigten, geht es hier ausschließlich um die SPRACHE selbst – jedes Feature, von Grund auf, an einer eigenen, durchgehenden Beispiel-App.

Was ist TypeScript?

TypeScript ist eine von Microsoft entwickelte Programmiersprache, die eine strenge, optionale Typisierung zu JavaScript hinzufügt. "Optional", weil JEDES gültige JavaScript auch gültiges TypeScript ist – Sie können TypeScript schrittweise einführen, ohne bestehenden Code neu schreiben zu müssen. "Strikt", weil TypeScript, sobald Sie Typen verwenden, diese KONSEQUENT durchsetzt: ein Typfehler wird VOR dem Ausführen erkannt, nicht erst zur Laufzeit.

Kein eigener Laufzeit-Interpreter: TypeScript wird zu JavaScript

Ein entscheidendes Missverständnis vorab ausräumen: Browser und Node.js können TypeScript-Code NICHT direkt ausführen. Der TypeScript-Compiler (tsc) übersetzt .ts-Dateien zu ganz normalem JavaScript – alle Typannotationen werden dabei VOLLSTÄNDIG entfernt, sie existieren nur zur ENTWICKLUNGSZEIT, haben keinerlei Einfluss auf die Laufzeit-Performance oder das Verhalten des ausgeführten Codes.

// Das schreiben Sie (input.ts):
function addiere(a: number, b: number): number {
  return a + b;
}

// Das führt der Browser/Node.js tatsächlich aus (output.js, nach tsc):
function addiere(a, b) {
  return a + b;
}

Warum überhaupt Typen? Ein konkretes Beispiel

Reines JavaScript erlaubt Folgendes anstandslos – bis es zur Laufzeit, oft weit entfernt von der eigentlichen Fehlerursache, abstürzt:

function berechneRabatt(preis, prozent) {
  return preis - (preis * prozent / 100);
}

berechneRabatt(100, '10'); // funktioniert "zufällig" (String wird umgewandelt)
berechneRabatt('100 Euro', 10); // NaN - kein Fehler, aber ein stilles, falsches Ergebnis
berechneRabatt(100); // NaN - fehlender Parameter, keine Warnung

Mit TypeScript wird JEDER dieser drei Aufrufe SOFORT im Editor als Fehler markiert – VOR dem ersten Ausführen, nicht erst, wenn ein Nutzer in Produktion auf eine falsche Berechnung stößt:

function berechneRabatt(preis: number, prozent: number): number {
  return preis - (preis * prozent / 100);
}

berechneRabatt(100, '10');   // Fehler: Argument vom Typ 'string' nicht zuweisbar zu 'number'
berechneRabatt('100 Euro', 10); // Fehler: Argument vom Typ 'string' nicht zuweisbar zu 'number'
berechneRabatt(100);         // Fehler: Erwartet 2 Argumente, aber 1 erhalten

Weitere Vorteile jenseits reiner Fehlervermeidung

• Autovervollständigung: der Editor kennt die exakte Form eines Objekts und schlägt NUR tatsächlich existierende Eigenschaften/Methoden vor – kein Rätselraten, welche Felder ein API-Ergebnis wirklich hat.
• Selbstdokumentierender Code: eine Funktionssignatur wie function sucheBuch(isbn: string): Buch | undefined erklärt ihr Verhalten, OHNE dass ein Kommentar nötig wäre.
• Sichereres Refactoring: benennen Sie eine Eigenschaft um oder ändern Sie eine Funktionssignatur, markiert TypeScript SOFORT alle Stellen im gesamten Projekt, die angepasst werden müssen.

Das Beispielprojekt dieser Serie: eine Bibliotheksverwaltung

Wir bauen gemeinsam eine Bibliotheksverwaltungs-App – ein reines Kommandozeilen-Programm in Node.js/TypeScript, OHNE React, OHNE Datenbank, OHNE Web-Framework. Der Grund für diese bewusst schlanke Wahl: Sie sollen sich ausschließlich auf die TypeScript-SPRACHE konzentrieren können, ohne von Framework-spezifischen Konzepten abgelenkt zu werden. Bücher, Autoren und Bibliotheksmitglieder verwalten – dabei werden wir JEDES wichtige TypeScript-Feature an einem echten, wachsenden Anwendungsfall erleben: von einfachen Typen über Klassen und Generics bis zu fortgeschrittenen Typ-Tricks.