その空白、見落としてない？JavaScriptの trim()

• 2026.10.14
• JavaScript

入力された検索キーワードを比較したら、見た目は同じなのに一致しない。原因が、コピーしたときに紛れ込んだ前後の空白だった……ということがあります。そんな場面で便利なのが、JavaScriptの trim() です。

取り除くのは文字列の「両端」

trim() は、文字列の先頭と末尾にある空白や改行などのホワイトスペースを取り除きます。途中にある空白はそのままです。

const text = "  Web Design  ";
const cleaned = text.trim();

console.log(cleaned); // "Web Design"
console.log(text);    // "  Web Design  "

元の文字列は変更されず、整えた文字列が返ります。text.trim(); と呼ぶだけで元の変数が書き換わるわけではないので、使いたい結果を変数に受け取るのがポイントです。

「空白だけの入力」を見分ける

空欄チェックでも役立ちます。空白が入った文字列は空文字ではありませんが、trim() 後に確認すれば、空白だけかどうかを判断できます。

const keyword = "   ";

if (keyword.trim() === "") {
  console.log("キーワードを入力してください");
}

検索欄の入力や、コピーして貼り付けた文字列を扱う前に、不要な前後の空白を整えたいときに使えます。実際のフォームなら、文字列として取得した入力値に適用してください。

何でも trim() すればよいわけではない

前後の空白に意味があるデータへ一律に適用すると、入力内容を変えてしまいます。たとえばパスワードや、字下げを保ちたい文章では、仕様を確認してから使いましょう。

また、trim() はHTMLを安全に表示するためのエスケープや、入力内容の妥当性チェックを代わりに行うものではありません。用途はあくまで前後の空白の整理です。フォームの検証は、サーバー側でも別途行う必要があります。

参照：MDN「String.prototype.trim()」