简化您的工作流程:搜索 miniwebtool。
添加插件
相关工具
CSS Flexbox 演练场是否启用了JavaScriptSVG 转 React/JSX 转换器
主页 > 网站管理工具 > TypeScript 在线演练场
 

TypeScript 在线演练场

在浏览器中编写、编译、类型检查和运行 TypeScript,支持实时诊断、JavaScript 输出、严格模式控制、快速示例以及沙盒控制台。

TypeScript 在线演练场
浏览器编译器驾驶舱
正在加载 TypeScript 编译器
快速示例:
TS playground.ts 正在等待编译器
0 行
编译器选项
编译流水线
TS
源代码
解析 TypeScript 文本
类型
检查契约与推断
JS
生成
生成 JavaScript 输出
运行
仅限沙箱控制台
ℹ 编译在浏览器中进行。紧凑的内置类型库适合代码片段;项目专属的包类型仍应保留在本地 TypeScript 环境中。

Embed TypeScript 在线演练场 Widget

编译器输出
正在等待 TypeScript
类型状态
等待中
诊断
0
输出大小
0 B
编译时间
0 ms
编译器正在加载。首次编译后诊断信息将显示在此处。
沙盒运行输出
运行编译后的 JavaScript 即可在此处查看控制台输出。
'; updateStage('run', false); runnerEl.srcdoc = sandboxHtml; } function downloadJavaScript() { const blob = new Blob([jsOutputEl.value], { type: 'text/javascript;charset=utf-8' }); const url = URL.createObjectURL(blob); const link = document.createElement('a'); link.href = url; link.download = 'playground.js'; document.body.appendChild(link); link.click(); document.body.removeChild(link); URL.revokeObjectURL(url); } function tidyIndents() { const tidied = sourceEl.value .replace(/\t/g, ' ') .split('\n') .map(function (line) { return line.replace(/\s+$/g, ''); }) .join('\n') .replace(/\n{4,}/g, '\n\n\n'); sourceEl.value = tidied; compileNow(); } function resetSource() { sourceEl.value = document.getElementById('tsplay-source').defaultValue; compileNow(); } sourceEl.addEventListener('input', scheduleCompile); sourceEl.addEventListener('scroll', function () { linesEl.scrollTop = sourceEl.scrollTop; }); sourceEl.addEventListener('keydown', function (event) { if (event.key === 'Tab') { event.preventDefault(); const start = sourceEl.selectionStart; const end = sourceEl.selectionEnd; sourceEl.value = sourceEl.value.slice(0, start) + ' ' + sourceEl.value.slice(end); sourceEl.selectionStart = sourceEl.selectionEnd = start + 2; scheduleCompile(); } }); document.querySelectorAll('[data-example]').forEach(function (button) { button.addEventListener('click', function () { const name = button.getAttribute('data-example'); if (EXAMPLES[name]) { sourceEl.value = EXAMPLES[name]; compileNow(); } }); }); document.querySelectorAll('.tsplay-result .tsplay-tab').forEach(function (tab) { tab.addEventListener('click', function () { setActiveTab(tab.getAttribute('data-tab')); }); }); [targetEl, moduleEl, strictEl, indexedEl, declarationsEl].forEach(function (control) { control.addEventListener('change', compileNow); }); compileBtn.addEventListener('click', compileNow); runBtn.addEventListener('click', runJavaScript); document.getElementById('tsplay-copy-source').addEventListener('click', function () { copyText(sourceEl.value, 'TypeScript'); }); document.getElementById('tsplay-copy-js').addEventListener('click', function () { copyText(jsOutputEl.value, 'JavaScript'); }); document.getElementById('tsplay-download-js').addEventListener('click', downloadJavaScript); document.getElementById('tsplay-format-btn').addEventListener('click', tidyIndents); document.getElementById('tsplay-clear-console').addEventListener('click', function () { consoleEl.textContent = '运行编译后的 JavaScript 即可在此处查看控制台输出。'; }); document.getElementById('tsplay-clear-btn').addEventListener('click', resetSource); window.addEventListener('message', function (event) { if (!event.data || event.data.tsplayToken !== runnerToken) { return; } addConsoleLine(event.data.kind, event.data.value); }); function waitForCompiler(attempt) { syncEditorStats(); if (window.ts) { compilerStateEl.textContent = 'TypeScript ' + window.ts.version + ' 就绪'; setStatus('ready', '编译器就绪'); compileNow(); return; } if (attempt > 80) { compilerStateEl.textContent = '编译器不可用'; setStatus('error', '编译器不可用'); diagnosticsEl.innerHTML = '
无法加载 TypeScript 编译器
请检查您的网络连接或内容拦截器,然后重新加载页面。
'; return; } setTimeout(function () { waitForCompiler(attempt + 1); }, 150); } waitForCompiler(0); })();
📲

安装 MiniWebtool 应用

添加到主屏幕即可即时访问 — 免费、快速、无需下载。

           

想要更快且无广告?

TypeScript 在线演练场

此 TypeScript Playground 让您无需打开完整项目即可快速测试代码片段。它在浏览器中运行 TypeScript 编译器,显示带行号的类型检查诊断信息,输出 JavaScript,并可在沙盒控制台中运行简单输出。

此 TypeScript Playground 的功能

此工具专为日常 TypeScript 检查而设计:验证联合类型收窄、测试泛型辅助类型、比较编译器目标、确认 strict 模式行为,以及审查 TypeScript 输出的 JavaScript。它适用于学习、调试简洁示例、准备解答,或在将小型重构移入项目之前进行检查。

如何使用 TypeScript 编译器

  1. 将 TypeScript 粘贴到编辑器中或选择一个快速示例。
  2. 选择 JavaScript 目标和模块格式。
  3. 如需更严格的诊断,请启用 strict 模式和可选的索引访问检查。
  4. 点击编译并进行类型检查,或保持自动编译启用以获得实时反馈。
  5. 查看诊断信息、检查输出的 JavaScript,然后在沙盒控制台中运行简单的代码片段。

类型检查注意事项

浏览器编译器对常见 JavaScript 对象(如数组、字符串、记录、JSON、console 和定时器)使用紧凑的内置声明文件。这使得 playground 在处理代码片段时保持快速且自包含。如果您的代码依赖于 React、Node.js、DOM API 或特定包的声明,请在项目内使用真实的 tsconfig.json 和已安装的类型包来确认最终结果。

示例与使用场景

当您想从较大的代码库中隔离类型错误、比较 strict 模式如何改变诊断、向队友解释 TypeScript 概念,或检查小型代码片段如何编译为 JavaScript 时,请使用此 playground。内置示例涵盖可辨识联合、泛型记录辅助函数、satisfies 运算符和有意的类型错误,让您能同时看到正常和失败的编译器状态。

  • 在将联合类型添加到 API 响应模型之前对其进行验证。
  • 测试泛型辅助函数,无需等待完整应用构建。
  • 在更改目标或模块选项时检查输出的 JavaScript。
  • 分享 TypeScript 诊断的简洁复现。
对于生产构建,请将此页面用作快速诊断工作台,然后在发布前运行您的项目编译器、打包器、代码检查器、测试和框架构建。

常见问题

此工具会检查 TypeScript 类型吗?

是的。它会在浏览器中构建 TypeScript 程序,并报告来自编译器的诊断信息,包括类型错误、语法错误和编译器选项消息。

我可以更改 TypeScript 编译器选项吗?

是的。主要控件涵盖 JavaScript 目标、模块输出、strict 模式、声明文件输出和 noUncheckedIndexedAccess。

为什么缺少某个库类型?

此 playground 有意使用紧凑的内置类型库。对于框架、DOM、Node.js 或 npm 包的类型,请使用您的本地项目设置。

JavaScript 运行器安全吗?

运行器使用沙盒化的 iframe 来运行简短代码片段。请避免运行不受信任的代码,并在您的常规开发环境中测试真实的应用代码。

引用此内容、页面或工具为:

"TypeScript 在线演练场" 于 https://MiniWebtool.com/zh-cn/typescript-在线演练场/,来自 MiniWebtool,https://MiniWebtool.com/

by miniwebtool team. Updated: 2026-05-23

网站管理工具:

常用工具:

MAC地址查找随机信用卡生成器彩票号码生成器凯利公式计算器网址提取器🌡️ 体感温度计算器相对标准偏差计算器太阳、月亮与上升星座计算器 🌞🌙✨英尺英寸转换为厘米音频提取器按字符数换行职位查找器SRT转为TXT工具CAGR计算器删除换行符厘米到英尺和英寸转换器比例计算器cpm计算器血糖转换器移除标点符号在线工具音频分割器图片打码工具百分比折扣计算器百分比计算器太阳位置计算器样本量计算器对数计算器随机扑克牌生成器MAC地址生成器毛利率计算器FPS 转换器VAT计算器定期存款计算器斜边计算器HEX计算器调整视频速度kg到lbs转换器磅转千克转换器根式化简器卡方检验计算器合并视频🎮 游戏灵敏度转换器考拉兹猜想计算器随机字符串生成器密码强度测试器Log Base 10 计算器图片压缩器📅 日期计算器质数检查器为图片添加文字t检验计算器位数计算器年度天数计算器 - 今天是今年的第几天百分比变化计算器PSI 转 Bar 转换器泰勒级数计算器随机IMEI生成器随机化数字花样字体生成器随机选择器Facebook用户ID查询srt时间偏移SHA256 哈希生成器农历转换器罗马数字转换器英寸到厘米转换器随机整数生成器黄金时刻和蓝调时刻计算器分数计算器年龄计算器标准偏差计算器 - 高精度One Rep Max (1RM) 计算器圆形面积计算器幻方生成器误差函数计算器随机虚假地址生成器MAC 地址分析工具椭圆周长计算器MD5哈希生成器利润计算器卧推计算器两点间距离计算器二项式系数计算器度分秒到十进制转换器死链检查器视频转图片提取器石头剪刀布生成器kpa到psi转换器八进制计算器厘米到英寸转换器发音音标转换器随机超能力生成器平方根计算器数字提取器⏱️ 倒计时器图片Base64转换器🖱️ 点击计数器百分比到ppm转换器配色方案生成器三角函数绘图器指数计算器-高精度线性回归计算器迷宫生成器随机数学题生成器十进制到十六进制转换器圆计算器按位计算器沸点计算器磅到克转换器随机坐标生成器复合增长率计算器积分计算器连续数之和计算器龙格-库塔RK4方法计算器体脂百分比计算器分数简化十六进制到十进制转换器数织生成器-picross英尺到米转换器WHOIS查询年金现值计算器日复利计算器楼梯计算器随机字母生成器雅可比矩阵计算器盎司到克转换器颜色代码转换器全格式乘法计算器伽玛功能计算器利率计算器圆柱体体积计算器 高精度填字游戏制作器月相计算器燃气与电力成本对比百分比增长率计算器真心话大冒险生成器箱线图生成器翻转视频透镜方程计算器Instagram用户ID查询YouTube频道统计反余弦 (Arccos) 计算器变异系数计算器📈 折线图制作工具抛硬币按长度排序文本斜率截距式计算器阶乘计算器隐形文本生成器不可见字符移除器商和余数计算器快速傅里叶变换FFT计算器最简分数计算器月亮星座计算器相关系数计算器DOY日历Voronoi 图生成器半衰期计算器⏱️ 在线秒表排序数字旋转视频随机英文单词生成器SRT合并工具Webhook测试器为视频添加水印图片分割器数据传输速率转换器斐波纳契数列表水星逆行日历🥧 饼图制作工具YouTube缩略图下载器圆锥展开图模板生成器多项式展开计算器科学记数法到十进制转换器科学记数法计算器获取字符串长度鞋码转换器Mann-Whitney U 检验计算器中位数计算器周数计算器坡度与倾斜度计算器工资转换计算器平均偏差计算器方差计算器 高精度期权盈利计算器椭圆面积计算器比例置信区间计算器特征值和特征向量计算器立方根计算器网站图标生成器💧 露点计算器骰子滚轮AI标点符号添加器VTT转txt转换器WHtR计算器克到磅转换器时间持续计算器极坐标方程绘图器查找并替换文本角速度计算器泳池盐量计算器泳池容积计算器热水器尺寸计算器环氧树脂计算器栏杆立柱间距计算器踢脚线和装饰线条计算器壁板计算器露台木器染色剂计算器草籽计算器草皮计算器沥青计算器立方码计算器天线长度计算器电线管填充率计算器串联并联电容计算器感抗计算器房间照明计算器勒克斯转流明计算器流明转瓦特转换器发电机功率计算器mah到wh转换器三相功率计算器kVA计算器安培转瓦特计算器瓦特转安培计算器串联电阻计算器摩擦力计算器斜面计算器机械效益计算器声速计算器波速计算器浮力计算器终端速度计算器德布罗意波长计算器光子能量计算器emc2计算器时间膨胀计算器开普勒第三定律计算器逃逸速度计算器万有引力计算器比尔-朗伯定律计算器能斯特方程计算器渗透压计算器沸点升高计算器凝固点降低计算器百分比组成计算器当量浓度计算器质量摩尔浓度计算器pKa到Ka转换器亨德森-哈塞尔巴尔赫计算器理论产量计算器限制反应物计算器电子排布计算器交互式元素周期表AI教案生成器AI测验生成器引用生成器 (APA/MLA/Chicago)出勤率计算器AP分数计算器ACT分数计算器SAT分数计算器百分比转CGPA转换器CGPA转百分比转换器简易评分器 EZ Grader养育孩子成本计算器宝宝奶量计算器尿布尺寸计算器婴儿名字生成器宝宝眼睛颜色预测器儿童BMI百分位计算器儿童身高预测器hcg翻倍时间计算器试管婴儿预产期计算器着床计算器中国生男生女预测器ISO 8601 日期格式化工具儒略日转换器小睡计算器日出日落计算器世界时钟日期罗马数字转换器退休倒计时戒瘾天数计算器半岁生日计算器纪念日计算器小费分配计算器电子邮件营销ROI计算器每条线索成本计算器营运资本计算器边际贡献计算器FIFO / LIFO 计算器安全库存计算器再订货点计算器经济订货量eoq计算器折旧计算器手工艺品定价计算器批发价格计算器Shopify 利润计算器亚马逊 FBA 计算器eBay费用计算器Etsy费用计算器Stripe 手续费计算器PayPal手续费计算器投注赔率转换器十一奉献计算器天课计算器英国印花税计算器HRA免税计算器服务酬金计算器NPS计算器EPF计算器PPF计算器RD计算器SWP计算器税前工资倒推计算器贷款比较计算器信用使用率计算器CD阶梯计算器美国国库券T-Bill计算器I 系列储蓄债券计算器529大学储蓄计算器HSA计算器遣散费计算器加薪计算器发票生成器出差津贴计算器里程报销计算器房租涨幅计算器按比例租金计算器房租承受能力计算器汽车落地价计算器购车预算计算器摩托车贷款计算器房车贷款计算器船舶贷款计算器土地贷款计算器建筑贷款计算器只付利息抵押贷款计算器气球贷计算器房贷点数计算器PMI计算器双周房贷还款计算器ARM浮动利率房贷计算器VA贷款计算器实发工资计算器AI SQL 查询生成器AI正则表达式生成器AI 数据可视化工具 (粘贴 CSV)AI文本语气分析器AI简历分析器AI单位转换器自然语言AI道歉信生成器AI礼貌借口生成器AI旅行行程生成器AI阅读清单生成器AI健身计划生成器AI膳食计划生成器AI礼物点子生成器ai食谱生成器根据现有食材奖学金投资回报率计算器大学费用计算器语言学习流利度小时数计算器词汇测验生成器康奈尔笔记生成器学习曲线计算器抽认卡间隔重复调度器颜料调色计算器瓷砖填缝剂计算器六西格玛过程能力计算器youtube收益估算器随机RPG角色生成器
×

帮我们一个忙,回答3个快速问题

感谢您参与我们的调查。您的意见将帮助我们改善服务。

您最初是从哪里得知我们的?

您在我们网站上最喜欢的工具是什么?

如果是其他,请说明:

您将这个工具推荐给朋友的可能性有多大?

不可能极有可能

可能性分数: (1-10)