TypeScript Playground

Mit diesem TypeScript Playground können Sie ein Snippet schnell testen, ohne ein vollständiges Projekt zu öffnen. Es führt den TypeScript-Compiler in Ihrem Browser aus, zeigt Typprüfungs-Diagnosen mit Zeilennummern an, gibt JavaScript aus und kann einfache Ausgaben in einer Sandbox-Konsole ausführen.

Was dieser TypeScript Playground tut

Das Tool ist für alltägliche TypeScript-Prüfungen konzipiert: Validierung der Union-Verengung, Testen generischer Hilfstypen, Vergleich von Compiler-Zielen, Bestätigung des Verhaltens im Strict-Modus und Überprüfung des von TypeScript ausgegebenen JavaScripts. Es ist nützlich zum Lernen, Debuggen eines kompakten Beispiels, Vorbereiten einer Antwort oder Überprüfen eines kleinen Refactorings, bevor es in ein Projekt übernommen wird.

So verwenden Sie den TypeScript-Compiler

1. Fügen Sie TypeScript in den Editor ein oder wählen Sie ein Schnellbeispiel.
2. Wählen Sie ein JavaScript-Ziel und ein Modulformat aus.
3. Aktivieren Sie den Strict-Modus und die optionale Prüfung des indizierten Zugriffs, wenn Sie eine strengere Diagnose wünschen.
4. Klicken Sie auf Kompilieren und Typprüfung, oder lassen Sie die automatische Kompilierung für Live-Feedback aktiviert.
5. Überprüfen Sie die Diagnose, inspizieren Sie das ausgegebene JavaScript und führen Sie dann einfache Snippets in der Sandbox-Konsole aus.

Hinweise zur Typprüfung

Der Browser-Compiler verwendet eine kompakte integrierte Deklarationsdatei für gängige JavaScript-Objekte wie Arrays, Strings, Records, JSON, Konsole und Timer. Das hält den Playground schnell und für Snippets in sich geschlossen. Wenn Ihr Code von React, Node.js, DOM APIs oder paketspezifischen Deklarationen abhängt, bestätigen Sie das endgültige Ergebnis in Ihrem Projekt mit dessen realer tsconfig.json und den installierten Typpaketen.

Beispiele und Anwendungsfälle

Verwenden Sie den Playground, wenn Sie einen Typfehler aus einer größeren Codebasis isolieren möchten, vergleichen wollen, wie der Strict-Modus die Diagnose ändert, einem Teamkollegen ein TypeScript-Konzept erklären oder prüfen möchten, wie ein kleines Snippet zu JavaScript kompiliert wird. Die integrierten Beispiele umfassen Discriminated Unions, generische Record-Helfer, den satisfies-Operator und absichtliche Typfehler, sodass Sie sowohl saubere als auch fehlschlagende Compiler-Zustände sehen können.

• Validieren Sie einen Union-Typ, bevor Sie ihn einem API-Response-Modell hinzufügen.
• Testen Sie einen generischen Helfer, ohne auf einen vollständigen Anwendungs-Build zu warten.
• Inspizieren Sie das ausgegebene JavaScript beim Ändern von Target- oder Module-Optionen.
• Teilen Sie eine kompakte Reproduktion einer TypeScript-Diagnose.

FAQ

Prüft dieses Tool TypeScript-Typen?

Ja. Es erstellt ein TypeScript-Programm im Browser und meldet Diagnosen vom Compiler, einschließlich Typfehler, Syntaxfehler und Compiler-Optionsmeldungen.

Kann ich TypeScript-Compiler-Optionen ändern?

Ja. Die Hauptsteuerungen umfassen JavaScript-Target, Modulausgabe, Strict-Modus, Deklarations-Emit und noUncheckedIndexedAccess.

Warum fehlt ein Bibliothekstyp?

Dieser Playground verwendet absichtlich eine kompakte integrierte Typbibliothek. Verwenden Sie für Framework-, DOM-, Node.js- oder npm-Pakettypen Ihr lokales Projekt-Setup.

Ist der JavaScript-Runner sicher?

Der Runner verwendet ein Sandbox-iframe für schnelle Snippets. Vermeiden Sie es, nicht vertrauenswürdigen Code auszuführen, und testen Sie echten App-Code in Ihrer normalen Entwicklungsumgebung.