它是一个浏览器里的 JS 代码试验场。
平时想跑一段 JavaScript,得开浏览器的开发者工具,或者写个 HTML 文件在控制台里敲。这个小工具把这些省了——打开网页,代码粘进去,点“立即运行”,结果和 console.log 的内容都显示在下面。
代码是在浏览器的安全沙箱里跑的,用的是原生 JS 引擎,支持 ES6+ 语法。
主要能做什么?
在线写 JS 代码:一个编辑框,直接敲或粘代码进去。
一键运行:点“立即运行代码”,几秒钟出结果。
实时捕获控制台:console.log、console.warn、console.error、console.info 的内容都会显示在下面的日志面板里,还带颜色区分:
蓝色:info
黄色:warn
红色:error
绿色:返回值
显示返回值:代码最后返回的值也会显示出来。
运行统计:
运行耗时(毫秒)
日志条数
返回值/状态
语法解析状态
示例代码:点一下自动填入一段带 console.log、变量、函数的示例。
快捷键:Ctrl + Enter(Mac 上是 Cmd + Enter)直接运行。
Tab 缩进:代码框里按 Tab 是插入两个空格,不会跳出输入框。
清空控制台:日志太多,一键清空。
一键复制:代码整段复制,统计值也能单独复制。
适合谁用?
前端开发者:临时验证一段 JS 逻辑,不用开控制台。
学 JavaScript 的新手:边写边看输出,理解代码运行过程。
写教程的人:做示例时快速验证代码能不能跑通。
测试人员:快速跑一段脚本验证想法。
任何想跑一小段 JS 的人:不用装 Node.js、不用开浏览器控制台。
用起来是什么感觉?
打开页面,顶部是一个深色大卡片,写着“JavaScript 代码在线调试 ES6+ Safe Sandbox”,状态栏显示“调试环境就绪,请输入代码”。
页面加载时会自动填入一段示例代码,直接能跑。
中间是代码编辑器,白色背景,等宽字体,右上角显示“字符数: X”。
下面接着是控制台输出面板,深色背景,一行行日志带颜色标签,自动滚到最新。右上角有个“清空控制台”。
再下面是运行状态监控,四块小面板:
运行耗时
日志条数
返回值/状态
解析语法
每块右边都有“复制”按钮。
底部四个按钮:
加载示例代码:重新填入示例
清空代码与日志:全部清空
复制代码:整段复制
立即运行代码(Ctrl+Enter)(绿色):点一下运行
操作流程就是:
在编辑框里写 JS 代码
点“立即运行”或按 Ctrl + Enter
下面的控制台立刻显示 console.log 的输出和返回值
报错也会显示在控制台里,红色标注
整个流程就是 “写代码 → 点运行 → 看输出”,几秒钟出结果。
对写 JS、学 JS、调试小逻辑的人来说,比开控制台、装 Node 方便多了,打开网页就能用。