JavaScript 大文字・小文字変換：toUpperCase と toLowerCase

JavaScript で文字列を大文字・小文字に変換するには toUpperCase() と toLowerCase() を使います。どちらも引数なしで呼び出すだけで動作します。

toUpperCase()：すべて大文字に変換

const str = 'Hello, World!'
console.log(str.toUpperCase()) // 'HELLO, WORLD!'

toLowerCase()：すべて小文字に変換

const str = 'Hello, World!'
console.log(str.toLowerCase()) // 'hello, world!'

大文字・小文字を区別しない比較

ユーザー入力を比較するときなど、大文字・小文字を無視して比較したい場面があります。両方を toLowerCase() してから比較するのが最もシンプルです。

const input = 'JavaScript'
const target = 'javascript'

// 大文字・小文字を区別する比較（false）
console.log(input === target) // false

// 大文字・小文字を無視して比較（true）
console.log(input.toLowerCase() === target.toLowerCase()) // true

localeCompare() で大文字・小文字を無視して比較

localeCompare() に { sensitivity: 'base' } オプションを渡すと、大文字・小文字および発音記号を無視して比較できます。

const a = 'JavaScript'
const b = 'javascript'

console.log(a.localeCompare(b, undefined, { sensitivity: 'base' })) // 0（一致）
console.log('Apple'.localeCompare('apple', undefined, { sensitivity: 'base' })) // 0（一致）

戻り値が 0 のとき一致、-1 のとき前者が先、1 のとき後者が先を意味します。

先頭だけ大文字にする

JavaScript には先頭だけ大文字にする組み込みメソッドはありません。スライスを組み合わせて実装します。

function capitalize(str) {
  if (!str) return str
  return str[0].toUpperCase() + str.slice(1).toLowerCase()
}

console.log(capitalize('hello')) // 'Hello'
console.log(capitalize('WORLD')) // 'World'

TypeScript での型

toUpperCase() / toLowerCase() は string を返すため、TypeScript でも追加の型アノテーションは不要です。

const name: string = 'alice'
const upper: string = name.toUpperCase() // 'ALICE'

まとめ

メソッド	変換内容	使用例
`str.toUpperCase()`	すべて大文字	`'hello'.toUpperCase()` → `'HELLO'`
`str.toLowerCase()`	すべて小文字	`'HELLO'.toLowerCase()` → `'hello'`
`a.toLowerCase() === b.toLowerCase()`	大文字・小文字を区別しない比較	検索・フィルタリング
`localeCompare({ sensitivity: 'base' })`	ロケール対応の区別なし比較	多言語対応が必要な場合