文字列の正規化(trim・大文字小文字の統一)

このレッスンでは、文字列の正規化(trim・大文字小文字の統一)を学び、ユーザー入力を安全に比較できるようになることを目標にします。「JavaScript trim 使い方」「JavaScript 文字列 正規化」で調べている方向けの内容です。

ユーザーが入力した文字列には、前後の余分な空白や、大文字・小文字の表記ゆれが含まれがちです。.trim()で空白を取り除き、.toLowerCase()で比較しやすい形に統一することを正規化と呼びます。この処理をせずに文字列を比較すると、人間には同じに見えてもfalseと判定されてしまうことがあります。

サンプルコードでは、normalizeという関数で.trim().toLowerCase()を連続して呼び出し、前後の空白除去と小文字化を1つの処理にまとめています。" Hello World "と"hello world"という見た目の違う2つの文字列も、正規化してから比較すると同じ文字列として扱えることを確認できます。

初心者がよくつまずくのが、正規化を一部の処理にしか適用せず、比較対象の片方だけ正規化を忘れてしまうケースです。文字列を比較する処理を書くときは、両方の文字列に必ず同じ正規化を適用することを意識しましょう。全角・半角の違いなど、正規化しきれないパターンがあることも覚えておくと安心です。

入力チェックやログイン処理などで欠かせない基本テクニックです。ユーザー登録フォームでの重複チェックや、検索機能の前処理として、正規化はさまざまな場面で登場する重要な下ごしらえの処理です。