主な内容の要点
String.prototype.replace メソッドを使って、文字列中の指定した部分を別の文字列で置換し、新しい文字列を返します。元の文字列自体は変わりません。
基本的な使い方
文字列.replace(置換対象, 新しい文字列)
JavaScript- 第一引数(置換対象)は 文字列 または 正規表現オブジェクト を指定可能。
- 第二引数で指定した文字列に置き換えた結果の 新しい文字列 が返されます。元の文字列は変更されない。
- 置換対象に合致する箇所が複数あっても、最初にマッチしたものだけ が置換されます(デフォルト動作)。
例:
let str = 'red bird and red flower';
let newstr = str.replace('red', 'Red');
console.log(newstr); // → "Red bird and red flower"
JavaScriptこの例では “red” が2回出てきますが、置換されるのは最初の “red” のみ。
記号を使った特別な値による置換
第二引数(置き換え後の文字列)の中に、ドル記号 $ を用いて「マッチした部分」や「前後の文字列」などを参照できる特殊な記法があります。以下が主なもの。
| 記号 | 意味 |
|---|---|
$& | マッチした部分全体 |
$` | マッチした部分の「前」の文字列 |
$' | マッチした部分の「後」の文字列 |
$$ | "$" の文字として扱う |
$1, $2, … | 正規表現でキャプチャグループを使った場合の参照(第1グループ、第2グループ…) |
使用例
let str = 'BananaLemonOrange';
console.log(str.replace('Lemon', '[$&]'));
// → "Banana[Lemon]Orange"
console.log(str.replace('Lemon', '[$`]'));
// → "Banana[Banana]Orange"
console.log(str.replace('Lemon', '[$\']'));
// → "Banana[Orange]Orange"
JavaScript[$&]はマッチした “Lemon” をそのまま挟む →"[Lemon]"[$]` はマッチ前の部分 “Banana” を挿入[$']はマッチ後の部分 “Orange” を挿入
注意点・補足
- 第一引数に 正規表現オブジェクト を指定することで、より柔軟な置換(全体マッチ、複数置換、キャプチャグループなど)が可能です。
$1, $2, …のような置換表記は、正規表現を用いた場合に有効です。通常の文字列指定の置換では使われないことが多い、との注意も示されています。

