TypeScript in JavaScript konvertieren Online
TypeScript direkt im Browser in JavaScript transpilieren. Kein Node.js, kein tsc-Install noetig. Ideal zum Lernen und Teilen von Code.
function greet(user: User) {
const greeting = "Hello, " + user.name;
return greeting;
}
const users: User[] = [
{ name: "John", age: 30, active: true },
];Warum diesen Transpiler verwenden
TypeScript zu JavaScript: keine Installationen noetig
Kein Node.js oder npm
TypeScript direkt im Browser transpilieren. Kein tsc-Install, keine tsconfig.json, keine Abhaengigkeiten.
Offizieller Compiler
Verwendet Microsofts TypeScript-Compiler als WebAssembly, gleiches Ergebnis wie beim lokalen tsc.
TypeScript lernen
Verstehe genau, was der Compiler aus deinen Types, Interfaces und Generics erzeugt.
Code teilen
JavaScript-Snippets mit Teams oder Umgebungen teilen, in denen TypeScript nicht konfiguriert ist.
So funktioniert es
Drei Schritte, kein Aufwand
TypeScript-Code einfuegen
Fuege deinen .ts-Code ein: Interfaces, Types, Generics, Enums, Dekoratoren oder jede andere TypeScript-Funktion, die du in einfaches JavaScript umwandeln moechtest.
Sofortige Transpilierung
Der offizielle TypeScript-Compiler (zu WebAssembly kompiliert) entfernt Typ-Annotationen und transpiliert in ES2015+-JavaScript in Millisekunden.
Resultierendes JavaScript kopieren
Erhalte das aequivalente JavaScript, das direkt im Browser oder in Node.js ausfuehrbar ist oder mit Teams geteilt werden kann, die kein TypeScript verwenden.
FAQ
Noch Fragen?
Der Transpiler entfernt alle TypeScript-exklusiven Elemente ohne JavaScript-Entsprechung: Typ-Annotationen wie string, number oder boolean, Interfaces, Type-Aliase, Generics, Zugriffsmodifikatoren wie public, private, protected und readonly an Klassen, Enumerationen (Enums werden in JavaScript-Objekte umgewandelt), den as-Typ-Assertion-Operator, das Schluesselwort declare fuer Umgebungsdeklarationen und experimentelle Dekoratoren. Kontrollstrukturen, Funktionen, Klassen (der Werteteil), Import/Export-Module und die gesamte Programmlogik bleiben unveraendert erhalten.
Der Online-Transpiler verwendet den offiziellen TypeScript-Compiler (von Microsoft entwickelt, seit Oktober 2012 als Open Source veroeffentlicht, derzeit in Version 5.x) mit der Zielkonfiguration ES2015 oder ES2017. Fuer die eigentliche Produktion ist der richtige Workflow: TypeScript mit npm install typescript installieren, tsconfig.json mit angemessener Striktheit konfigurieren (strict: true ist seit TypeScript 2.3 die empfohlene Praxis) und tsc oder Bundler wie Vite, esbuild, SWC oder webpack mit ts-loader verwenden. Der Online-Transpiler eignet sich hervorragend fuer die schnelle Erkundung, das Lernen oder das Teilen von Code-Snippets.
TypeScript hat zwei Dekorator-Systeme: Legacy-Dekoratoren (--experimentalDecorators, seit TypeScript 1.5 im Jahr 2015 verfuegbar, verwendet von Angular, NestJS und inversify) und TC39-Stage-3-Dekoratoren (in TypeScript 5.0, Maerz 2023, implementiert). Der Online-Transpiler unterstuetzt beide ueber die entsprechende Konfiguration. Legacy-Dekoratoren erzeugen JavaScript-Code mit __decorate()- und __metadata()-Aufrufen; TC39-Stage-3-Dekoratoren erzeugen saubereren Code gemaess dem ECMAScript-Vorschlag.
TypeScript unterstuetzt JSX ueber .tsx-Dateien. Die jsx-Konfiguration des Compilers steuert die JSX-Transformation: react (in React.createElement() umwandeln), react-jsx (den neuen JSX-Transform von React 17+ verwenden), react-native (JSX unveraendert lassen) und preserve (JSX fuer einen anderen Transpiler wie Babel unbehandelt lassen). Fuer React-Projekte mit TypeScript ist die Nutzung von Vite (das intern esbuild fuer TSX verwendet) oder CRA und Next.js der empfohlene Workflow.
Ja. ES6-Modul-Imports und -Exports bleiben standardmaessig erhalten, wenn das Ziel ES2015 oder hoeher ist. TypeScript entfernt auch typbasierte Imports (import type { User } from './types'), da diese keine Laufzeitdarstellung haben. Wenn das Ziel CommonJS ist (module: commonjs in tsconfig), werden Imports und Exports in require() und module.exports umgewandelt.
Ja. TypeScript wurde von Anders Hejlsberg (auch Designer von C# und Turbo Pascal) bei Microsoft entwickelt und im Oktober 2012 als Open Source veroeffentlicht. Das Typsystem, Interfaces, Generics und Enums sind TypeScript-Ergaenzungen, aber jede gueltige JavaScript-Datei ist auch gueltiges TypeScript. Der tsc-Compiler war der erste weitverbreitete moderne JavaScript-Transpiler und Vorlaeufker des heutigen Oekosystems aus Babel, esbuild, SWC und Vite.
TypeScript online in JavaScript transpilieren: ohne Node.js oder tsc-Installation
TypeScript ist eine Programmiersprache, die von Microsoft entwickelt und im Oktober 2012 als Open Source veroeffentlicht wurde. Sie wurde von Anders Hejlsberg entworfen, der auch fuer das Design von C# (2000) und Turbo Pascal (1983) verantwortlich ist, mit dem Ziel, JavaScript durch ein optionales statisches Typsystem fuer grosse Anwendungen zu skalieren. TypeScript ist eine syntaktische Obermenge von JavaScript (ECMAScript): Jedes gueltige JavaScript ist gueltiges TypeScript, und der tsc-Compiler gibt standardkonformes JavaScript aus. TypeScript 5.x ist laut der Stack-Overflow-Entwicklerumfrage 2024 eine der am weitesten verbreiteten Sprachen, mit massiver Akzeptanz in Oekosystemen wie Angular (das TypeScript seit Version 2 im Jahr 2016 voraussetzt), NestJS, Next.js und praktisch jedem grosstechnischen Frontend-Projekt.
Der TypeScript-zu-JavaScript-Transpilierungsprozess besteht im Wesentlichen aus der Typ-Loeschung: Der Compiler analysiert den TypeScript-Code und gibt JavaScript aus, indem er alle Typinformationen ohne Laufzeitdarstellung entfernt. Entfernt werden Typ-Annotationen an Variablen, Funktionsparametern und Rueckgabetypen; vollstaendige Interfaces und Type-Aliase; Zugriffsmodifikatoren an Klassen; Typparameter in Generics; Typ-Assertions; und Umgebungsdeklarationen. Transformiert (nicht nur entfernt) werden Enumerationen, die in JavaScript-Objekte mit bidirektionalem Mapping umgewandelt werden, sowie Legacy-Dekoratoren, die __decorate()- und __metadata()-Hilfscoode erzeugen.
Das Oekosystem der TypeScript-Transpilierungs-Tools hat sich erheblich weiterentwickelt. Der urspruengliche tsc-Compiler (seit 2012 als npm-Paket verfuegbar) ist die Verhaltensreferenz und bietet vollstaendige Typueberpruefung. Fuer die Build-Geschwindigkeit bei grossen Projekten sind Alternativen entstanden, die die Transpilierungsgeschwindigkeit ueber die Typueberpruefung stellen: esbuild (2020, in Go geschrieben, 10 bis 100-mal schneller als tsc), SWC (2019, in Rust geschrieben, von Next.js verwendet) und der TypeScript-Transformer von Babel. Vite verwendet esbuild fuer die TypeScript-Transpilierung in der Entwicklung. Convertir.ai verwendet den offiziellen TypeScript-Compiler als WebAssembly, um genaue Treue zum tsc-Verhalten zu gewaehrleisten, und fuehrt den gesamten Prozess in deinem Browser aus, ohne Code an irgendeinen Server zu senden.