JavaScriptのreplace()メソッドで文字列から余分な空白を削除する方法

JavaScriptで文字列を扱う際、文字列の先頭や末尾に不要な空白が含まれていることがあります。例えば、次のような文字列を考えてみましょう。

var fullName = " John Smith ";

このように前後に空白がある文字列から、replace()メソッドと正規表現（Regex）を組み合わせることで、余分な空白を簡単に取り除くことができます。

replace()と正規表現を使った空白削除の実装例

以下のコードでは、文字列の先頭と末尾にある空白を削除する関数を定義しています。

function removeSpacesAtTheBeginningAndTheEnd(name) {
    return name.toString().replace(/^\s+|\s+$/g, '');
}

var fullName = " John Smith ";
var valueAfterRemovingSpace = removeSpacesAtTheBeginningAndTheEnd(fullName);
console.log(valueAfterRemovingSpace);

正規表現の解説

ここで使用している正規表現 /^\s+|\s+$/g の意味は以下の通りです。

• ^\s+：文字列の先頭にある1つ以上の空白文字にマッチ
• |：または（OR条件）
• \s+$：文字列の末尾にある1つ以上の空白文字にマッチ
• gフラグ：グローバル検索を有効にし、すべての該当箇所を置換対象にする

マッチした空白は空文字列 '' に置き換えられるため、結果として先頭と末尾の空白だけが削除されます。文字列内の途中にある空白はそのまま残ります。

プログラムの実行方法

上記のプログラムを実行するには、Node.js環境で以下のコマンドを使用します。

node fileName.js

ここではファイル名を demo208.js として保存しています。

実行結果

このプログラムを実行すると、以下のような出力が得られます。

PS C:\Users\Amit\javascript-code> node demo208.js
John Smith

出力を見ると、「John Smith」の前後にあった空白がきれいに削除されていることが確認できます。

補足：trim()メソッドという選択肢

なお、先頭と末尾の空白だけを削除したい場合は、JavaScriptに標準で用意されているtrim()メソッドを使う方法もあります。

var fullName = " John Smith ";
console.log(fullName.trim()); // "John Smith"

ただし、replace()と正規表現を使う方法には、文字列内のすべての空白を削除したり、タブや改行など特定の空白文字だけを対象にしたりと、柔軟なカスタマイズが可能というメリットがあります。用途に応じて使い分けるとよいでしょう。