如何使用 JavaScript 在线编译器
- 在编辑器中编写或粘贴 JavaScript 代码。按重置示例可以恢复初始示例代码。
- 按运行，或使用 Ctrl + Enter（Mac 上为 ⌘ + Enter）。
console.log、console.info和console.debug的输出会显示在输出面板中。console.warn、console.error以及未捕获的异常（包括其堆栈跟踪）会以错误样式突出显示。- 选择 5、15 或 60 秒的时间限制。运行时间超过限制的脚本会被自动停止，您也可以随时按停止。
无需下载任何东西。JavaScript 直接在浏览器内置的引擎上运行，所以页面打开即可使用。用复制或 main.js 保存代码。
代码在本地运行，也就是在您自己浏览器的 Web Worker 中运行，绝不会上传到或存储在我们的服务器上。编辑器会把最近一次的代码保存在浏览器的本地存储中，除此之外不会保存在任何地方。
支持哪些功能
- 现代 JavaScript：浏览器支持的一切特性，包括类、箭头函数、解构赋值、可选链（
?.）、空值合并（??）、BigInt、Map/Set以及较新的数组方法。 - 顶层
await：代码会被包裹在一个异步函数中，所以可以直接awaitPromise。 - 定时器和 Promise：
setTimeout、setInterval、Promise.all等函数都可以使用。当顶层代码（包括所有被 await 的操作）执行完毕时，本次运行即视为结束。 - 可在 Worker 中使用的 Web API，例如
JSON、Intl、TextEncoder、crypto.getRandomValues和structuredClone。
限制：
- 没有 DOM。代码在 Worker 中运行，所以无法使用
document、window和alert()。 - 不支持
import/require。这不是 Node.js，所以无法加载 npm 包和fs等 Node 模块。 console.table会把数据输出为 JSON，而不是绘制成表格。- 运行行为取决于您使用的浏览器。较旧的浏览器可能不支持最新的特性。
JavaScript 速查
const scores = { ada: 91, linus: 78, grace: 85 };
const passed = Object.entries(scores)
.filter(([, s]) => s >= 80)
.map(([name, s]) => `${name}: ${s}`);
console.log(passed); // ["ada: 91", "grace: 85"]，以 JSON 形式输出
const sleep = ms => new Promise(r => setTimeout(r, ms));
await sleep(100);
console.log(scores.bob ?? 'no score');| 任务 | 语法 |
|---|---|
| 声明变量 | const x = 1; let y = 2; |
| 箭头函数 | const add = (a, b) => a + b; |
| 模板字符串 | `Total: ${sum}` |
| 严格相等 | a === b |
| 解构赋值 | const { id, name } = user; |
| 等待 Promise | const data = await promise; |
使用技巧
- 对象和数组会以缩进的 JSON 格式输出。直接输出它们，例如
console.log({ a, b })，就能看到变量名和对应的值。 Map和Set输出时会带上大小和内容（例如Map(2) [...]），BigInt值会带有n后缀。- 把 JSON 输出复制到 JSON格式化与校验工具中，可以校验它，或者折叠和浏览大型结构。
- 如果代码杂乱或经过压缩，可以先用 JavaScript格式化与压缩工具整理，再粘贴到这里。
- 挂在
globalThis上的值在多次运行之间会保留，直到您按下停止。用const或let声明的变量则不会保留。
提示：想要类型注解？TypeScript在线编译器的用法完全相同，还会显示它生成的 JavaScript 代码。
常见问题
这里运行的是哪个 JavaScript 版本？
取决于浏览器引擎所支持的版本：Chrome 和 Edge 使用 V8，Firefox 使用 SpiderMonkey，Safari 使用 JavaScriptCore。这些浏览器的当前版本都支持现代 ECMAScript，包括 ES2024 的特性。
为什么 document 是 undefined？
为了让页面保持流畅和安全，代码在 Web Worker 中运行，而 Worker 无法访问页面。请用这个工具处理逻辑、算法和数据，而不是操作 DOM。
可以使用 npm 包吗？
不可以。import、require 和 Node.js 内置模块都不可用。只能使用语言本身以及 Worker 提供的标准 Web API。
如果写了死循环会怎样？
页面仍会保持响应，因为循环在 Worker 中运行。达到时间限制或您按下停止时，Worker 会被关闭，代码随之停止。
更新于