camelCase、snake_case 还是 kebab-case:该用哪种
JavaScript 用 camelCase,Python 和数据库用 snake_case,CSS 和网址用 kebab-case。讲清每种命名法适用的场景,并介绍如何免费转换。
发布于 · 阅读约 7 分钟
camelCase、snake_case 和 kebab-case 的选择,主要取决于名字在哪里使用。JavaScript 和 Java 用 camelCase(firstName),Python、Ruby 和 SQL 用 snake_case(first_name),CSS、HTML 属性和网址用 kebab-case(first-name)。请遵循所用语言的惯例和团队的风格指南。要在不同大小写之间转换文本,免费大小写转换工具和免费网址短链接生成器在浏览器里就能完成大部分工作。
camelCase、snake_case 和 kebab-case 一览
| 风格 | 示例 | 常见于 |
|---|---|---|
| camelCase | userFirstName |
JavaScript 和 TypeScript 的变量与函数、Java 方法、许多网络 API 返回的 JSON |
| PascalCase | UserFirstName |
大多数语言中的类名、React 组件、C# 方法 |
| snake_case | user_first_name |
Python 变量和函数、Ruby、SQL 列名、许多 JSON API |
| SCREAMING_SNAKE_CASE | USER_FIRST_NAME |
许多语言中的常量、环境变量 |
| kebab-case | user-first-name |
CSS 属性和类名、HTML 属性、网址、文件名、命令行参数 |
这些名字来自它们的外形:camelCase 中有一个个大写字母凸起的“驼峰”,snake_case 平铺在下划线上,kebab-case 的词则像烤串一样被连字符穿在一起。

各语言的习惯
JavaScript 和 TypeScript。 变量和函数用 camelCase(getUserName),类和 React 组件用 PascalCase(UserCard),常量通常用 SCREAMING_SNAKE_CASE(MAX_RETRIES)。语言自带的函数也是如此,例如 getElementById 和 toLowerCase。
Python。 PEP 8 是 Python 的风格指南,函数、变量和模块名用 snake_case,类用 CapWords(即 PascalCase),常量全部大写并用下划线连接。在 Python 里写 getUserName 虽然能运行,但每个读它的 Python 开发者都会觉得格格不入。
CSS 和 HTML。 CSS 属性用 kebab-case(background-color、font-size),大多数类名体系也沿用这一习惯(.nav-item、.card-title)。HTML 的 data- 属性同样是 kebab-case,浏览器会把它们转换给 JavaScript 使用:data-user-id 会变成 element.dataset.userId。这一行代码很好地说明了两种惯例为什么同时存在。
SQL 和数据库。 列名和表名通常用 snake_case(created_at、order_items)。许多数据库会把未加引号的名字统一成一种大小写,所以 createdAt 如果不每次加引号,就可能悄悄变成 createdat。snake_case 可以避免这个问题。
网址和文件名。 使用 kebab-case。Google 的网址结构指南建议用连字符而不是下划线来分隔单词,因为连字符能清楚地标出词的边界。全部小写也能避免一些服务器把 About.html 和 about.html 当作两个文件而导致链接失效。请参阅什么是网址短链接和我们的网址短链接最佳实践。
JSON 和 API。 没有唯一的规则。许多以 JavaScript 为主的 API 使用 camelCase,许多 Python 或 Ruby 后端则返回 snake_case。每个 API 选定一种,并且同一个响应中绝不混用。
哪种最易读?
三种风格习惯之后都很易读。它们之间有几个实际的差别:
- snake_case 和 kebab-case 在词与词之间保留了清晰的间隔,对长名字和缩写更友好(
html_parser、htmlParser、HTMLParser对比之下,前者最清楚)。 - camelCase 更短,不需要额外的符号。
- kebab-case 在大多数语言中不能用作变量名,因为
user-name会被读成“user 减 name”。 - 双击选中时,大多数编辑器会选中整个 snake_case 或 camelCase 名字,但在 kebab-case 中通常只会停在连字符处。
真正的原则是保持一致。一个文件里同时出现 userName、user_name 和 UserName,会比任何一种风格统一使用都更难读。
转换不同的命名法
在不同层之间传递数据时,你需要做转换:例如 Python 接口的 created_at 要变成 JavaScript 的 createdAt,页面标题要变成网址,或者一个设置名要变成环境变量。
转成 kebab-case 或 snake_case:使用短链接生成器。 把词语粘贴进去,每行一个名字,然后选择 连字符(-) 得到 kebab-case,或选择 下划线(_) 得到 snake_case。它会把所有字母转为小写,把带重音的字母转为普通字母,并去掉符号。它会把任何符号当作词的分隔,所以 user_first_name 会变成 user-first-name,反之亦然。但它不会拆分 camelCase:userFirstName 会变成 userfirstname。所以请先在词与词之间加上空格。
转成 SCREAMING_SNAKE_CASE。 先在短链接生成器中得到 snake_case 版本,然后粘贴到免费大小写转换工具中,点击 大写。反过来,小写 会把 MAX_RETRIES 变成 max_retries。
转成 camelCase 或 PascalCase。 没有一键按钮。最快的方法:用空格分开输入这些词,在大小写转换工具中点击 首字母大写(user first name 会变成 User First Name),然后去掉空格得到 PascalCase,再把第一个字母改为小写得到 camelCase。
在代码中一次处理很多名字。 进行大规模重命名时,可以用编辑器的正则表达式查找替换。先在免费正则表达式测试工具中测试模式:例如 _([a-z]) 能找到每个后面紧跟字母的下划线,也就是 snake_case 转 camelCase 时需要大写的位置。许多编辑器可以在替换内容中把捕获的字母转为大写,具体语法请查阅你所用编辑器的文档。
转换时要注意的地方
- 缩写。 决定用
userId还是userID,用HtmlParser还是HTMLParser,然后始终保持一致。 - 数字。
address_line_2转换得很干净;addressLine2也没问题;只是别把数字丢掉。 - 公开的名字。 重命名 JSON 字段或网址会让使用它的人出问题。网址要添加重定向;API 中则应在一段时间内保留旧字段名。
转换你的文本
大写、小写和首字母大写请使用免费大小写转换工具,kebab-case 和 snake_case 请使用短链接生成器。两者都在浏览器中运行,你粘贴的内容不会离开你的设备。
常见问题
- camelCase 和 snake_case 有什么区别?
- camelCase 把词连在一起,并把除第一个词以外的每个词首字母大写(
firstName)。snake_case 让词保持小写,并用下划线连接(first_name)。 - JSON 中应该用 camelCase 还是 snake_case?
- 两者都可以。选择与你的大多数客户端所用语言一致的风格,并在同一个 API 内保持一致。
- 为什么 CSS 使用 kebab-case?
- CSS 的设计就采用了带连字符的属性名,例如
font-size,类名通常也遵循同样的风格。连字符在大多数编程语言的变量名中不能使用,这也是 JavaScript 对同样的属性采用 camelCase 的原因。 - kebab-case 适合用在网址中吗?
- 适合。Google 建议用连字符分隔网址中的词,而全部小写能避免大小写敏感的问题。
- 大小写转换工具能转成 camelCase 吗?
- 不能一键完成。先使用首字母大写,然后去掉空格,并把第一个字母改为小写。对于 kebab-case 和 snake_case,请使用网址短链接生成器。
文本工具
试试英文大小写转换
免费,无需注册,直接在浏览器中使用。 粘贴文本,一键转换为全部大写(UPPERCASE)、全部小写(lowercase)、句首大写、标题式大写或每词首字母大写,然后复制使用。