本文へスキップ
Case Converter Online
ja

キャメルケース変換ツール(camelCase)

単語、snake_case、kebab-case をキャメルケース(camelCase)に変換します。名前を1つだけでも、1行に1つずつ並べたリストでも貼り付けられます。

文字数
0
単語数
0
文の数
0
行数
0

変換

プログラミング用

ブラウザ内で処理され、テキストがアップロードされることはありません。

camelCase とは

camelCase(キャメルケース)は、単語をスペースなしでつなげる書き方です。最初の単語は小文字のまま、2つ目以降の単語はすべて大文字で始めます。

  • first name は firstName になります
  • total_order_count は totalOrderCount になります
  • is-logged-in は isLoggedIn になります

プログラミング言語では名前にスペースを使えないため、どこで単語が区切れているかを示す方法が必要です。camelCase はそれを大文字で表します。

ツールがテキストを読み取る仕組み

ツールは単語の区切りを見つけてから、それらをつなげます。区切りとして扱うのは次のものです。

  • スペースとタブ
  • アンダースコア、ハイフン、ドット、スラッシュ
  • 小文字の直後の大文字。たとえば UserName は「User」と「Name」として読み取ります

そのうえで最初の単語を小文字にし、残りの単語の先頭を大文字にして、区切り文字を取り除きます。アポストロフィは削除されるので、「don’t stop」は dontStop になります。数字は残ります。

全角スペースも区切りとして扱われるので、日本語入力のまま「user first name」と入力しても userFirstName になります。一方、日本語の単語はそのまま残ります(「user 名前 id」は user名前Id)。また、全角の英字は全角のまま出力されるため、変数名に使う場合は英単語を半角で入力してください。

各行は個別に処理されます。データベースのフィールドの列や JSON のキーの一覧も、一度に変換できます。

入力 出力
user first name userFirstName
order_total_amount orderTotalAmount
background-color backgroundColor
GetUserById getUserById
API response code apiResponseCode

camelCase が使われる場所

  • JavaScript と TypeScript:変数、関数、オブジェクトのプロパティ
  • Java、Kotlin、Swift:変数名とメソッド名
  • JSON:多くの Web API のキー
  • C#:ローカル変数と引数
  • CSS in JavaScript:background-color の代わりに backgroundColor

ほかの言語では別のスタイルが好まれます。Python と Ruby の変数にはスネークケース(snake_case)が使われ、ほとんどの言語のクラス名にはパスカルケース(PascalCase)が使われます。

よくある変換

snake_case から camelCase へ。 Python や SQL のバックエンドから JavaScript のフロントエンドにデータを渡すときに便利です。フィールド名を貼り付けて、リストごと変換してください。

kebab-case から camelCase へ。 CSS のプロパティや HTML の属性はハイフンを使いますが、JavaScript から読むには camelCase が必要です。たとえば data-user-id は dataUserId になります。

普通の単語から camelCase へ。 「is email verified」のような説明を入力すると、そのまま使える変数名になります。

キャメルケース変換のよくある質問

キャメルケースとは何ですか?

キャメルケースは、複数の単語からなる名前をスペースなしで書く方法です。最初の単語は小文字で始め、2つ目以降の単語は大文字で始めます。firstName や totalOrderCount のような形です。途中の大文字がラクダ(camel)のこぶのように見えることから、この名前が付きました。

camelCase と PascalCase の違いは何ですか?

違いは最初の1文字だけです。camelCase は小文字で始まり(userName)、PascalCase は大文字で始まります(UserName)。PascalCase はアッパーキャメルケースと呼ばれることもあり、その場合 camelCase はローワーキャメルケースと呼ばれます。

HTML や ID などの略語はどう扱われますか?

各単語は大文字1文字と残りの小文字で書かれるので、「parse HTML string」は parseHtmlString に、「user ID」は userId になります。これは最近の多くのスタイルガイドの慣習と同じです。チームで parseHTMLString のように書くルールなら、その名前は手作業で直してください。

たくさんの変数名をまとめて変換できますか?

できます。名前を1行に1つずつ書いてください。各行が別々に変換され、改行もそのまま残るので、50個の列名を貼り付ければ50個の camelCase の名前が返ってきます。

その他のコード・データツール

すべてのツールを見る