跳至内容

免费代码格式化工具:美化JavaScript、Python、HTML等

代码格式化工具可为JavaScript、Python、HTML、CSS、Java、C++、JSON、XML等十二种以上编程语言的代码自动添加正确的缩进和间距,将杂乱压缩的代码整理为整洁易读的格式。全部处理均在浏览器本地完成,代码不会上传到任何服务器,安全、免费且无需注册账号,适合开发者日常代码整理和风格统一使用。

代码格式化工具

一键格式化您的代码。选择语言,粘贴代码,即可获得格式规范的结果。

使用方法:

  1. 从下拉菜单中选择编程语言。
  2. 将未格式化的代码粘贴到输入区域。
  3. 点击“格式化代码”按钮。
  4. 从输出区域复制格式化结果。
加载计算器...
📚

文档

什么是代码格式化工具?

代码格式化工具会在不改变代码功能的情况下,使用一致的缩进、换行和空格重写源代码。此代码格式化工具在网页浏览器中运行,支持 12 种编程语言,包括 JavaScript、Python、HTML 和 CSS。

此代码格式化工具如何工作

该工具为每种语言使用不同的规则。除 JSON 外,这些规则都不会为代码构建完整的解析树。

  • JSON 使用浏览器内置的 JSON 解析器进行解析,然后以两格缩进重新输出。如果 JSON 无效,工具会报告错误且不显示输出。
  • JavaScript、TypeScript、Java、C、C++ 和 C# 共用一种格式化器。它逐字符扫描代码,跟踪花括号、圆括号和分号。每个 { 都会开始一个新的缩进代码块,每个 } 或 ; 都会结束一行。注释和带引号的字符串会原样复制,不作修改。此格式化器不会为原代码中缺少的运算符两侧空格或逗号后空格补加空格;它只重新构建换行和缩进。
  • Python 读取每行现有的缩进,并按照 Python 语言本身使用的相同嵌套规则,以每级四个空格重新构建缩进。它不会拆分长行、添加空行或在运算符周围添加空格;它只规范每行的缩进深度。
  • CSS 会移除多余的换行和空白,然后在每个 { 和 ; 后换行,并在每个 } 前换行。
  • HTML 和 XML 会为每层嵌套标签添加换行和两个空格的缩进,并识别 <br>、<img> 和 <input> 等标准自闭合标签。
  • SQL 会将固定的一组关键字(如 SELECT、FROM、WHERE、JOIN 和 ORDER BY)转换为大写,并在每个主要子句前换行。

由于只有 JSON 处理路径会实际解析输入,其他格式化器都不会检测缺少括号或字符串未闭合等语法错误。无论输入的文本是否能够运行,它们都会对其重新格式化。

支持的语言

语言常见文件扩展名缩进宽度
JavaScript.js2 个空格
TypeScript.ts2 个空格
HTML.html2 个空格
CSS.css2 个空格
Python.py4 个空格
Java.java4 个空格
C.c4 个空格
C++.cpp4 个空格
C#.cs4 个空格
SQL.sql按子句换行
JSON.json2 个空格
XML.xml2 个空格

如何格式化代码

  1. 从下拉菜单中选择一种编程语言。
  2. 将未格式化的代码粘贴到输入框中。
  3. 选择“格式化代码”。
  4. 从输出框中复制格式化后的结果。

格式化完全在浏览器内部进行。代码不会发送到服务器。

JavaScript 格式化示例

格式化前:

1function add(a, b) {
2    if (a > 0) { return a + b; }
3    return 0;
4}
5

格式化后:

1function add(a, b) {
2  if (a > 0) {
3    return a + b;
4  }
5  return 0;
6}
7

格式化器将 { } 内的代码移到单独的缩进行,并将每级缩进规范为两个空格。它保留了 a > 0 和 a + b 周围原有的空格,因为这些空格本来就存在。

Python 格式化示例

格式化前:

1def calculate_average(numbers):
2  if len(numbers) == 0:
3    return 0
4  total = sum(numbers)
5  return total / len(numbers)
6

格式化后:

1def calculate_average(numbers):
2    if len(numbers) == 0:
3        return 0
4    total = sum(numbers)
5    return total / len(numbers)
6

原始代码每级缩进使用两个空格。格式化器按照 PEP 8(Python 官方风格指南)中所述的风格,以每级四个空格重新构建每行的缩进。它保持每行的顺序不变,也不修改行内空格。

为什么代码格式化很重要

不一致的缩进会让人难以看出函数、循环或条件语句在哪里结束。经过多人编辑的代码常常会混用制表符和空格缩进,或者某些行无法与其所属代码块对齐。使用格式化器处理后,每个文件都会具有相同的视觉结构,从而更快地浏览代码,也更容易发现位置错误的括号。

局限性

  • 输入大小:该工具最多接受 50,000 个代码字符。超过此长度的输入会在格式化开始前被拒绝,并显示错误消息。
  • 大多数语言不进行语法检查:只有 JSON 输入会被解析和验证。其他 11 种语言的代码会按原样重新格式化,即使其中缺少括号或字符串未闭合。在这种情况下,输出可能只是缩进错误,而不会被标记为错误。
  • 不会调整运算符周围的空格:JavaScript、TypeScript 和 C 系列语言的格式化器只会重新排列换行和缩进。如果原本没有空格,它们不会在 +、=、!== 周围或逗号后插入空格。
  • 不支持 PHP:选择不受支持的语言时,代码会保持不变返回。

常见问题

此工具会检查我的代码是否存在语法错误吗? 只检查 JSON。JSON 输入会被解析,因此无效的 JSON 会产生错误消息。其他受支持语言的代码会在不检查语法是否有效的情况下重新格式化。

它会将我的代码发送到服务器吗? 不会。格式化完全在浏览器中使用 JavaScript 运行。代码不会上传或存储到任何地方。

它最多能格式化多少代码? 50,000 个字符。粘贴更多字符会在格式化开始前产生错误。

它会在运算符周围或逗号后补上缺少的空格吗? 对于 JavaScript、TypeScript、Java、C、C++ 和 C#,不会。这些格式化器只会围绕花括号和分号重新构建缩进与换行,其余内容都会按照每行原有的写法复制。

它使用什么缩进? JavaScript、TypeScript、HTML、CSS、JSON 和 XML 使用两个空格。Python、Java、C、C++ 和 C# 使用四个空格。

为什么我的代码格式化后看起来几乎没变? 如果输入本来就使用了一致的空格和同一种括号样式,格式化器主要会重新构建缩进,因此变化可能很小。它最适合处理缩进混乱的代码,或被压缩到极少几行中的代码。