2種類の変換
このツールの変換は性質の違う2種類に分かれます。1つ目は文字そのものの大文字・小文字を切り替える変換(UPPERCASE、lowercase、Title Case、Sentence case、tOGGLE cASE)で、句読点や改行はそのまま、アルファベットの 大きさだけを変えます。2つ目は単語に分けてから1つの識別子として連結する変換(camelCase、PascalCase、 snake_case、CONSTANT_CASE、kebab-case、dot.case)で、空白・アンダースコア・ハイフン・ドットなどを単語の境目として 扱い、新しい規則でつなぎ直します。したがって「user profile image URL」を camelCase にするとuserProfileImageUrl、その結果を kebab-case に変換しても user-profile-image-url になります。 出発点がどの表記でも、含まれる単語が同じなら同じ結果になるのが、この種類の長所です。
単語の境目の見つけ方
識別子への変換の出来は「どこで単語を区切るか」で決まります。このツールは次の順で境目を探します。
- 小文字または数字の直後に大文字が来たら、その間で区切ります(userName → user Name、getUserID → get User ID)。
- 大文字が連続し、その後に「大文字+小文字」が続くときは、最後の大文字の前で区切ります(HTMLParser → HTML Parser、XMLHttpRequest → XML Http Request)。
- 文字・数字以外のすべての記号(空白、_、-、.、スラッシュ、括弧など)は区切りとして扱い、取り除きます。
2番目の規則のおかげで、略語を含む名前が1文字ずつバラバラになることを防げます。下の表は、実際の変換関数にサンプルを 入力して得た結果です。どの行も同じ単語リストから出発しているので、列をまたいで比べられます。
| 入力 | camelCase | PascalCase | snake_case | CONSTANT_CASE | kebab-case | dot.case |
|---|---|---|---|---|---|---|
| user profile image URL | userProfileImageUrl | UserProfileImageUrl | user_profile_image_url | USER_PROFILE_IMAGE_URL | user-profile-image-url | user.profile.image.url |
| HTMLParser | htmlParser | HtmlParser | html_parser | HTML_PARSER | html-parser | html.parser |
| getUserID2 | getUserId2 | GetUserId2 | get_user_id2 | GET_USER_ID2 | get-user-id2 | get.user.id2 |
| order-total_price | orderTotalPrice | OrderTotalPrice | order_total_price | ORDER_TOTAL_PRICE | order-total-price | order.total.price |
| XMLHttpRequest | xmlHttpRequest | XmlHttpRequest | xml_http_request | XML_HTTP_REQUEST | xml-http-request | xml.http.request |
「getUserID2」のように、数字は直前の文字に付いたままになります(「ID2」で1つの塊)。数字と文字の間でも区切りたい 場合は、変換前の入力に空白を入れてください。限界もあります。このツールは辞書を持たないため、「newyork」のように 小文字でつながった語を2つに分けることはできません。空白・区切り記号・大文字への切り替わりといった目印が必要です。
どの表記をどこで使うか
表記法は好みではなく、言語やツールごとの慣習です。破ってもたいてい動作はしますが、コードレビューやリンタで指摘され、 環境によっては実際に支障が出ます。
- camelCase: JavaScript・TypeScript、Java、Swift などの変数・関数・メソッド名。JSONのキーにもよく使われます。
- PascalCase: クラス・型、React や Astro のコンポーネント名、C#のメソッド名。Goでは先頭が大文字だとパッケージ外に公開されます。
- snake_case: Python(PEP 8)や Rust の関数・変数、多くのデータベースのテーブル名・カラム名。
- CONSTANT_CASE(UPPER_SNAKE_CASE): 定数や環境変数名。
DATABASE_URLのように大文字で書くのが慣習です。 - kebab-case: URLのパス、CSSのクラス名やカスタムプロパティ、HTML属性、ファイル名。ほとんどのプログラミング言語では、ハイフンが引き算に解釈されるため識別子には使えません。
- dot.case: 設定キー(
server.port)、パッケージや名前空間のパス、ログのイベント名。 - Title Case / Sentence case: 見出し、メニューやボタンの文言、通常の文章。次の節で規則を説明します。
Title Case と Sentence case の実際の規則
Title Case は各単語の先頭を大文字にしますが、慣例として冠詞(a、an、the)、等位接続詞(and、but、or)、短い前置詞(of、in、on、at、to、by、for)は 小文字のままにします。ただし最初と最後の単語は必ず大文字です。「小さな語は小文字のまま」をオンにすると、先頭と末尾以外で リスト中の語(a、an、the、and、but、or、nor、for、so、yet、of、in、on、at、to、by、up、as)を小文字に保ち、オフにするとすべての語を大文字で始めます。 AP、APA、Chicago、MLA といったスタイルガイドは、4文字以上の前置詞を大文字にするかなどの細部が異なるため、 すべてに一致させることはできません。出版社や学会に出す見出しは、その規定と照らし合わせてください。
Sentence case は文の最初の1文字だけを大文字にし、残りを小文字にします。ピリオド・疑問符・感嘆符のあとの空白や、 新しい行の先頭も文頭とみなします。注意点は、固有名詞や略語まで小文字になることです。「Paris is in FRANCE.」は 「Paris is in france.」になるので、France、NASA、iPhone などは変換後に手で直してください。
検算した変換例
例1: 「user profile image URL」は空白が3つあるので、4つの単語(user、profile、image、URL)に分かれます。snake_case では すべて小文字にしてアンダースコアでつなぎ、user_profile_image_url になります。CONSTANT_CASE ならUSER_PROFILE_IMAGE_URL です。
例2: 「HTMLParser」は規則2で「HTML」と「Parser」に分かれます。snake_case なら html_parser、kebab-case ならhtml-parser、camelCase なら htmlParser で、先頭の略語は小文字にするという一般的な慣習と一致します。 小文字から大文字への切り替わりだけを探す単純な変換器だと、「htmlparser」になってしまいます。
ユニコードの大文字・小文字が単純でなくなる場面
大文字にすれば必ず1文字が1文字に対応し、小文字にすれば元に戻る、と考えがちですが、英語以外ではこの前提が崩れます。 このツールはブラウザ標準の toUpperCase() / toLowerCase() を使い、ユニコードの既定の (言語に依存しない)対応表に従います。次の表は実際にそのメソッドを実行して得た結果です。
| 入力 | メソッド | 結果 | 説明 |
|---|---|---|---|
| straße | toUpperCase() | STRASSE | ドイツ語のßは大文字にすると SS の2文字になり、文字数が増えます。 |
| İstanbul | toLowerCase() | i̇stanbul | トルコ語の点つき大文字 İ は、i と結合用の点記号に分かれた形になります。 |
| istanbul | toUpperCase() | ISTANBUL | トルコ語の規則を使わないと普通の I になります。トルコ語では İSTANBUL が正しい形です。 |
| ISPARTA | toLowerCase() | isparta | トルコ語の規則を使わないと i になります。トルコ語では点なしの ı (ısparta)です。 |
| ΣΑΣ | toLowerCase() | σας | ギリシャ語の大文字Σは語末で ς、それ以外で σ になり、前後の文脈で結果が変わります。 |
トルコ語とアゼルバイジャン語は有名な落とし穴で、点つきのiと点なしのıがあるため、「I」と「i」が互いの大文字・小文字に ならないのです。正しく処理するには toLocaleUpperCase('tr') のような言語指定の処理が必要で、このページは 使っていないため、トルコ語は目視で確認してください。一方、日本語のひらがな・カタカナ・漢字、中国語、韓国語、数字、 記号には大文字・小文字の区別がなく、そのまま残ります。日本語混じりの文に大文字変換をかけても、英字の部分だけが変わります。 コーディング用の表記は日本語も空白や記号で区切ってつなぎますが(例: 「会員 情報 更新」→ 会員_情報_更新)、日本語を 識別子に使えるかは言語やチームの規約によるため、使う前に確認してください。
複数行をまとめて変換する
カラム名20個の一覧をまとめて snake_case にする、といった作業はよくあります。「行ごとに別々に変換する」をオンに しておくと、各行が独立した識別子として扱われ、行数が保たれます。オフにすると全体が1つの識別子にまとまり、 改行も区切りとして消えます。UPPERCASE、lowercase、Title Case、Sentence case、tOGGLE cASE は、常に改行と句読点を そのまま残します。
よくある間違い
- 変換は元に戻せると思い込む: 「XMLHttpRequest」を snake_case にすると「xml_http_request」で、これを camelCase に戻すと「xmlHttpRequest」になり、略語の大文字は復元されません。元の文字列は別に保管してください。
- API名やDBのカラム名を一括変換してそのまま反映する: JSONのキーやカラム名を変えるとサーバー、クライアント、クエリのすべてに影響します。名前だけの問題では済まないので、互換性を先に確認してください。
- URLのスラッグにsnake_caseを使う: URLでは単語の区切りにハイフンを使うのが一般的で、読みやすいURLの解説もその前提で書かれています。kebab-caseが無難です。
- Title Caseで見出しが完成すると期待する: 汎用の規則を当てはめるだけなので、eBay や iPhone のようなブランド名は認識できず、従うスタイルガイドと食い違うことがあります。
このツールが向かない場合
ソースコード全体の識別子を、参照箇所ごとまとめて変更するリファクタリングには、エディタの「シンボルの名前変更」機能が 必要です。このページはテキストを変えるだけで、コードの意味は理解しません。固有名詞の自動認識や文法のチェックにも 対応していません。
変換したあとの使い方
変換した一覧は、文字数カウントで件数を確かめたり、テキスト比較で変換前後の差分を行単位で確認したりできます。名前を 一括で置換するための正規表現は、正規表現テスターで先にサンプルを使って 試せます。変換した名前をJSONに入れるなら、JSON整形で構文を確認できます。
よくある質問
日本語や中国語のテキストも変換できますか?
大文字・小文字の区別があるのはラテン文字、ギリシャ文字、キリル文字などです。日本語・中国語・韓国語のテキストは大文字・小文字ボタンを押しても変わりません。camelCase や snake_case などは空白や記号で区切って連結するため、どんな文字でも動作しますが、もともと英語ベースのコード命名のための表記です。
入力したテキストは保存されますか?
いいえ。変換はすべてブラウザ内で行われ、サーバーには送信されません。
camelCase と PascalCase の違いは何ですか?
どちらも区切り文字なしで各単語の先頭を大文字にします。違いは最初の1文字だけで、camelCase は小文字始まり(userName)、PascalCase は大文字始まり(UserName)です。変数や関数には camelCase、クラス・型・コンポーネントには PascalCase を使う言語が多くあります。
HTMLParser が h_t_m_l_parser ではなく html_parser になるのはなぜですか?
大文字が連続し、その後に大文字+小文字が来る位置(ここではLとPの間)を、略語と次の単語の境目と判断するためです。HTML が1語として扱われ、html_parser や html-parser という自然な結果になります。
数字を含む名前はどう処理されますか?
数字は隣接する文字とひとまとまりのままです。「version2 update」は snake_case で「version2_update」になります。数字の前後で区切りたいときは、入力に空白を入れてください。
改行や句読点が消えてしまいます。
コーディング用の表記では、文字・数字以外をすべて区切りとして扱うため、これは正常な動作です。行数を保つには「行ごとに別々に変換する」をオンにし、句読点を残したいときは UPPERCASE・lowercase・Title Case・Sentence case を使ってください。