Softonic

JavaScript 格式化器

步 1 / 3
下一个

粘贴一段经过压缩或缩进不当的JavaScript代码片段，即可获得格式规范、清晰易读的代码，其格式完全遵循编辑器的标准规则。可自定义选项卡与空格设置、单引号/双引号使用、分号是否添加、ES5标准下的末尾逗号处理方式等参数。该工具兼容现代语法，支持可选链式连接、空值合并、 JSX 、TypeScript以及顶级await语句。

如何格式化 JavaScript

  1. 1

    粘贴源代码

    任何有效的JavaScript、 JSX 或TypeScript代码均可。解析器会根据语法结构自动识别对应的编程语言方言。

  2. 2

    设置您的偏好

    缩进大小、制表符与空格的使用、引号样式、分号、打印宽度以及末尾逗号。

  3. 3

    格式

    该工具可执行与Prettier兼容的处理流程，并输出格式化后的结果。

  4. 4

    复制输出内容

    一键复制或下载为文件。原始缩进将被丢弃，不会叠加在上方。

样式选项

选项 值 默认值
缩进 tab、2、4 2个空格
引用样式 single、double 双引号
分号 always、never 始终
打印宽度 60 - 120 80
逗号标记 none、es5、all es5
箭头括号 always、avoid 始终
括号间距 true，false true
JSX 单引号 true，false false

为什么格式很重要

格式化并非仅为美观，其核心在于减轻认知负担。规范统一的代码格式能让审阅者专注于逻辑变更，而非费力寻找错位的大括号。

  • “Bike-shedding”流程在项目采用格式化工具后即告结束。git diff 展示的是实际修改内容，而非关于缩进格式的争议之处。
  • 预提交钩子（使用 Husky 和 lint-staged 等工具）会在文件提交前自动格式化已准备好的版本文件。
  • 编辑器集成（VS Code、WebStorm）在保存时会应用相同的规则。

格式设置无法实现的功能

  • 不会产生代码异味。 格式规则（no-unused-vars、eqeqeq）属于 ESLint 的管辖范围；格式化工具仅调整空格和标点符号的排列方式，并不会因逻辑问题而拒绝代码。
  • 该工具无法修复语法错误。 若输入的代码为无效的 JavaScript 代码，格式化器将抛出异常。请将其作为代码是否至少能被正确解析的验证手段。
  • 该规则不强制执行命名规范。 camelCase 与 snake_case 是代码检查规则，而非格式化规则。

常见错误

  • 对抗格式化工具。 若在程序运行后仍频繁重新格式化，既浪费时间又效率低下。建议配置相关选项或接受项目的默认设置。
  • 在生成文件上运行格式化操作。Bundler输出结果、反编译代码或.min.js均无法受益；仅源文件格式化有效，其他产物均无效。
  • **无需解析即可格式化。**使用regex“ PrettyPrint”功能会损坏模板字面量、regex字面量及 JSX 。请始终使用基于AST的格式化工具（如本工具）。

常见问题

是的。解析器能够识别TypeScript语法（类型、接口、泛型、装饰符）并进行相应格式化处理。.tsx/.jsx文件中也支持 JSX 语言。

其遵循与Prettier默认设置相同的规则，并可通过常规选项（打印宽度、引号、分号、末尾逗号）进行配置。在此格式化的文件应与使用相同配置的Prettier生成文件格式一致。

该格式化工具要求使用有效且可解析的JavaScript代码。若出现错误，通常表明代码存在语法问题（如括号未闭合、 JSX 无效或拼写错误）。若提示信息不明确，请先运行代码进行代码检查。

是的。单行注释（//）和块状注释（/* */）均保留在输出结果中，并保持与源文件中的位置一致。

相关工具

ASCII 表参考

完整 ASCII 表，覆盖 0 到 127；列出每个代码的十进制、十六进制、八进制、二进制值和 HTML 数字字符引用写法，包括 NUL、LF、DEL。

HTML 字符参考

可搜索的 HTML 实体列表，含命名代码与数值代码，并支持一键复制特殊字符和符号。

键盘快捷键参考

搜索 macOS、Windows 和 Linux 上 VS Code、Chrome 以及使用 GNU Readline 的 Bash 的文档默认快捷键。

邮箱验证器

验证邮箱地址：RFC 5322 语法检查、实时 MX 记录查询，并显示本地部分、域名和长度详情。不会发送任何邮件。

编辑器配置生成器

根据你的缩进样式与大小、行尾、字符集和空格规则生成 .editorconfig 文件，让不同集成开发环境（IDE）和编辑器的格式保持一致。

证书解码器

粘贴一张 X.509 PEM 证书，并查看解码后的字段：主体、颁发者、序列号、签名算法、有效期及主体备用名称（SAN）。

此工具还提供其他语言版本