JavaScriptで文字列を大文字・小文字に変換する方法を徹底解説

JavaScriptでは、Stringオブジェクトのプロトタイプに用意されているtoUpperCase()メソッドとtoLowerCase()メソッドを使うことで、バニラJavaScript（ライブラリやフレームワークに依存しない素のJavaScript）だけで、文字列を大文字や小文字に簡単に変換できます。

toUpperCase()：文字列を大文字に変換する

toUpperCase()メソッドは、文字列内のすべての英字を大文字に変換した新しい文字列を返します。元の文字列は変更されない（イミュータブルである）点に注意してください。

コード例

let str = "Hello World";
let upper = str.toUpperCase();
console.log(upper);

実行結果

このコードを実行すると、以下の出力が得られます。

HELLO WORLD

toLowerCase()：文字列を小文字に変換する

toLowerCase()メソッドは、文字列内のすべての英字を小文字に変換した新しい文字列を返します。ユーザー入力の正規化や、大文字小文字を区別しない文字列比較などでよく使われます。

コード例

let str = "Hello World";
let lower = str.toLowerCase();
console.log(lower);

実行結果

このコードを実行すると、以下の出力が得られます。

hello world

ロケールに対応した変換メソッド

さらに、言語（ロケール）固有のルールに従って変換を行いたい場合は、toLocaleUpperCase()とtoLocaleLowerCase()メソッドも利用できます。トルコ語など、大文字小文字の変換に特殊な規則を持つ言語を扱う際に役立ちます。

コード例

let str = "istanbul";
console.log(str.toLocaleUpperCase("tr-TR")); // İSTANBUL
console.log(str.toLocaleLowerCase("tr-TR"));

まとめ

文字列の大文字・小文字変換には、基本となるtoUpperCase()とtoLowerCase()を使えばほとんどの場面に対応できます。多言語対応が必要なケースでは、ロケールを指定できるtoLocaleUpperCase()やtoLocaleLowerCase()を使い分けるとよいでしょう。いずれのメソッドも元の文字列を変更せず、変換後の新しい文字列を返すという点は共通しています。