JavaScript 格式化与压缩工具

什么是 JavaScript 格式化？

核心功能

示例

function add(a,b){return a+b}const doubled=[1,2,3].map(x=>x*2);console.log(doubled)

async function load(id){const r=await fetch(`/api/${id}`);if(!r.ok)throw new Error('bad');return r.json()}

const cfg={retries:3,timeout:5000,headers:{'Content-Type':'application/json'},onError(e){console.warn(e)}}

class Counter{#n=0;inc(){this.#n++}get value(){return this.#n}}

常见使用场景

读懂压缩代码

美化压缩或混淆后的脚本，让你能理解和调试它。

代码审查

提交 Pull Request 前格式化 JavaScript，确保代码一致、便于 diff。

压缩上线

用 Terser 压缩生产环境 JavaScript，减少字节数、加快加载速度。

整理代码片段

将从控制台或 gist 粘贴的代码重新格式化为整洁可读的形式。

技术细节

使用 js-beautify 美化

采用久经检验的 js-beautify 引擎，缩进和间距输出可预期、可配置。

使用 Terser 压缩

Terser 是事实上的 JavaScript 压缩标准 — 重命名局部变量、删除死代码、去除注释，同时保留行为。

浏览器端运行

完全在客户端运行；你的代码不会离开设备或抵达服务器。

最佳实践

源码格式化，生产压缩

在代码仓库中保留可读代码，让构建流程用 Terser 压缩。

谨慎压缩新语法

Terser 针对标准 JavaScript；非常新的语法提案可能需要先转译。

不要手动编辑压缩输出

重命名后的变量使压缩代码难以维护 — 编辑源码后再重新压缩。

常见问题