Tools mentioned in this article
Open the browser-based tool while you read and try the workflow immediately.
API 的 JSON 鍵用 snake_case、TypeScript 變數用 camelCase、CSS 類別或 URL 用 kebab-case、環境變數用 CONSTANT_CASE——開發時各種命名規則總是同時存在。Case Converter 只要輸入一個識別字,就能同時轉換成 9 種命名規則並排比較,完全在瀏覽器內完成。

支援的 9 種命名規則
| 規則 | 範例 | 主要用途 |
|---|---|---|
| camelCase | helloWorld | JavaScript/TypeScript 變數、函式 |
| PascalCase | HelloWorld | 類別名稱、型別名稱、React 元件 |
| snake_case | hello_world | Python 變數、資料庫欄位、API 的 JSON 鍵 |
| CONSTANT_CASE | HELLO_WORLD | 常數、環境變數 |
| kebab-case | hello-world | CSS 類別、URL slug、檔名 |
| dot.case | hello.world | 設定鍵、屬性路徑 |
| path/case | hello/world | 檔案路徑、路由 |
| Title Case | Hello World | 標題、文件標題 |
| Sentence case | Hello world | UI 文字、說明文字 |
兩種模式
快速轉換:一個詞比對 9 種規則
在輸入欄輸入一個識別字,9 種轉換結果就會即時並列顯示。像「這個 API 回應的鍵,在 TypeScript 那邊該叫什麼名字?」這類日常轉換,一眼就能看懂。每個結果都可以一鍵複製。
批次轉換:整份清單一次轉成同一規則
貼上多行清單並選擇要轉換的目標規則,就能一次轉換所有行。空行會原樣保留,因此貼上的清單與轉換結果的行數不會對不上。像是把資料庫欄位名稱清單改成 TypeScript 屬性名稱、把常數清單轉成環境變數名稱,這類工作可以一次完成。
聰明的轉換:邊界偵測規則
這個工具不是單純的字串替換,而是先解析單詞邊界再重新組合,因此以下情況也能正確處理:
- 連續大寫(縮寫):
HTTPServerError→http_server_error。HTTP會被辨識為一個單詞 - 數字的處理:
base64Encode→base64_encode。數字會保持附著在相鄰單詞上,不會被拆開 - 混合分隔符:即使像
user-profile_imageURL這樣連字號、底線、大寫邊界混在一起,也會先拆解成單詞,再依目標規則重組
輸入資料不會離開瀏覽器
轉換完全在瀏覽器內以 JavaScript 完成,輸入的識別字不會傳送到伺服器。即使是內部 API 的欄位名稱或尚未公開的 schema 資訊,也能安心使用。
常見問題
連續大寫字母(HTTP、URL 這類縮寫)會怎麼處理?
HTTPServer 會被辨識為 http 和 server 兩個單詞。連續大寫的縮寫是依照「最後一個大寫字母+小寫字母」之前的位置來切分,因此 XMLHttpRequest 也能正確拆解成 xml/http/request。
含有數字的識別字會怎麼轉換?
數字會被視為與相鄰字元同一個單詞。base64Encode 會變成 base64 和 encode 兩個單詞,在 snake_case 下就是 base64_encode。數字不會被單獨拆成一個詞。
可以一次轉換多行嗎?
可以。只要在批次轉換模式中貼上清單,選擇目標規則即可。空行會維持空行,因此不會打亂與原始清單的行對應關係。
輸入的內容會被傳送出去嗎?
不會。轉換完全在瀏覽器內完成,輸入內容不會傳送到伺服器。