TypeScript转JavaScript编译器
TypeScript 转 JavaScript 编译器
💻 TypeScript Compiler
📐 工作原理与说明
把 TypeScript 编译为 JavaScript。
- 流程：先做类型检查，再擦除类型注解，并按 target 降级语法（如转为 ES5）。
- 类型擦除：类型信息只在编译期存在，运行时不可见，因此无法用于运行时校验。
- 配置：tsconfig.json 控制 target、module、strict、lib 与输出目录。
- 提醒：编译不校验外部数据，接口返回值等仍需做运行时校验。
Compile TypeScript to JavaScript in your browser — try code without a toolchain.
TypeScript 输入
JavaScript 输出
编译耗时：- ms
输出行数：- 行
输出大小：- 字符
🩺 编译诊断信息
0
▼
等待编译...
⚠️ 使用说明与注意事项
- 本工具使用
ts.transpileModule进行单文件转译，会移除类型注解但不做完整类型检查 - 类型错误（如赋值类型不匹配）不会被检测，仅语法错误和部分语义错误会出现在诊断面板
- 需要完整类型检查请使用本地
tsc或 IDE - 所有编译在浏览器本地完成，代码不会上传到服务器
- 建议在主流浏览器（Chrome/Safari/Firefox/Edge）中使用
📚 深度解析：TypeScript 转 JavaScript
💡 常见使用场景
- 把 TS 类型擦除编译为可运行 JS。
- 验证一段 TS 代码的编译结果：看清类型擦除后剩下什么，以及装饰器、枚举被降级成了什么形态。
编译
`let x: number = 1;` → `let x = 1;`（类型注解被移除）。
❓ 常见问题（FAQ）
- 类型检查在编译时做吗？
- 是，tsc 编译同时做类型检查，浏览器只跑 JS。
- 为什么编译通过了运行时仍然报错？
- 因为 TypeScript 的类型只在编译期起作用，运行时类型信息被完全擦除；来自接口响应、JSON.parse 或用户输入的数据，编译器无从校验。因此关键边界必须用运行时校验（如 schema 校验库）守住，类型是第二道防线而不是唯一防线。
▼
工具简介
TypeScript 转 JavaScript 编译器是一款基于官方 TypeScript 5.3 编译器的在线工具。它在浏览器本地调用 ts.transpileModule API，将 TypeScript 代码实时转译为 JavaScript，支持选择 ES3 到 ESNext 的目标版本与 None、CommonJS、AMD、ESNext 模块系统，并提供编译诊断信息。所有代码处理都在浏览器中完成，不会上传到任何服务器，保障隐私安全。
功能特点
- 基于官方 TypeScript 5.3 编译器
- 左右分栏实时编辑与输出
- 支持 ES3/ES5/ES6/ES2017/ES2020/ESNext 目标
- 支持 None/CommonJS/AMD/ESNext 模块系统
- 移除注释、严格模式、isolatedModules 选项
- 300ms 防抖实时编译
- 编译诊断信息（错误/警告/位置）
- 显示编译耗时与输出行数
- Tab 键缩进支持
- 一键复制 / 下载 JS 文件
- 深色模式与移动端响应式
使用场景
- 学习 TypeScript 语法与类型系统
- 验证 TS 代码降级为不同 ES 版本的效果
- 将含类型注解、接口、泛型的 TS 转为 JS
- 快速查看枚举、可选链等特性的编译产物
- 在线调试 TS 语法错误
- 老项目降级到 ES5 兼容旧浏览器