JavaScriptで任意の記法の文字列をキャメルケースに変換する方法

問題

JavaScriptで、通常の文・スネークケース・パスカルケースなどどんな記法で書かれた文字列でも受け取れる関数を作成し、その文字列をキャメルケース（camelCase）に変換することを考えます。

たとえば、関数への入力が次のようになっているとします。

入力

const str = 'New STRING';

期待される出力

const output = 'newString';

サンプルコード

以下が実際のコードです。

const str = 'New STRING';
const toCamelCase = (str = '') => {
    return str
        .replace(/[^a-z0-9]/gi, ' ')
        .toLowerCase()
        .split(' ')
        .map((el, ind) => ind === 0 ? el : el[0].toUpperCase() + el.substring(1, el.length))
        .join('');
};
console.log(toCamelCase(str));

出力結果

newString

コードの解説

この関数は、次の手順で文字列をキャメルケースへと変換しています。

1. replace(/[^a-z0-9]/gi, ' ')：英数字以外のすべての文字（アンダースコア「_」やハイフン「-」など）を半角スペースに置き換え、単語の区切りを統一します。
2. toLowerCase()：文字列全体をいったん小文字に揃えます。
3. split(' ')：スペースを基準に文字列を分割し、単語の配列を作成します。
4. map(...)：先頭の単語はそのまま使い、2番目以降の単語は最初の文字だけを大文字にして、残りをそのまま連結します。
5. join('')：すべての単語をつなぎ合わせて、最終的なキャメルケースの文字列を生成します。

補足：連続した空白への対応

元の文字列に複数の連続したスペースが含まれる場合、split(' ') の結果に空文字列が混ざり、意図しない出力になることがあります。そのようなケースに備えるには、filter(Boolean) を挟んで空の要素を除外しておくとより安全です。

const toCamelCase = (str = '') => {
    return str
        .replace(/[^a-z0-9]/gi, ' ')
        .toLowerCase()
        .split(' ')
        .filter(Boolean)
        .map((el, ind) => ind === 0 ? el : el[0].toUpperCase() + el.substring(1, el.length))
        .join('');
};