文字列.trim() / trimStart() / trimEnd()対応: ES5（ECMAScript 2009）

// 先頭と末尾の空白を除去します。
文字列.trim()

// 先頭の空白のみを除去します。
文字列.trimStart()

// 末尾の空白のみを除去します。
文字列.trimEnd()

var str = "   Hello World   ";

// 先頭と末尾の空白を除去します。
console.log(str.trim()); // 『Hello World』と出力されます。

// 先頭の空白のみを除去します。
console.log(str.trimStart()); // 『Hello World   』と出力されます。

// 末尾の空白のみを除去します。
console.log(str.trimEnd()); // 『   Hello World』と出力されます。

// 文字列の途中にある空白はそのまま残ります。
console.log(str.trim().length); // 『11』と出力されます。

// タブや改行も空白文字として除去されます。
var code = "\t\n  Hello  \n\t";
console.log(code.trim()); // 『Hello』と出力されます。

// フォーム入力値のバリデーションに活用できます。
var input = "   ";
if (input.trim() === "") {
	console.log("空欄です"); // 空白のみの入力を検出できます。
}

上記のコードを実行すると、コンソールには以下が出力されます。

"Hello World"       // 先頭と末尾の空白が除去される
"Hello World   "    // 先頭のみ除去。末尾の空白は残る
"   Hello World"    // 末尾のみ除去。先頭の空白は残る
11                  // 途中の空白はそのまま残る
"Hello"             // タブや改行も除去される
"空欄です"           // 空白のみの入力を検出

『文字列.trim()』は文字列の先頭と末尾にある空白文字を除去するメソッドです。半角スペースだけでなく、タブ・改行・全角スペースなどの空白文字も対象になります。文字列の途中にある空白は除去されません。

最もよく使われる場面はフォーム入力値のバリデーションです。ユーザーがうっかり先頭や末尾にスペースを入力してしまった場合に『文字列.trim()』で取り除くことで、正しい値を取得できます。空白のみの入力も input.trim() === "" で検出できるため、入力チェック処理には欠かせないメソッドです。

『文字列.trimStart()』と『文字列.trimEnd()』は片側だけの空白を除去したい場合に使用します。いずれも元の文字列は変更せず、新しい文字列を返します。