JavaScript replace

構文

リプレスした文字列 = リプレイスしたい文字列.replace(regexp or substr, newSubstr or function)

第1引数(パターン)

regexp

RegExp オブジェクト、またはリテラルです。

マッチすると、第2引数の newSubStr または function の戻り値と置き換えられます。

RegExpとは？

new RegExpのやつ

 new RegExp('\\w+');

リテラルとは？

バックスラッシュのやつ。

/dog/gi;

substr

newSubStr に置き換えられる String です。

これは逐次的(=つぎつぎに行われるさまのこと)な文字列として扱われ、正規表現としては解釈されません。

最初に出てきたものだけが置き換えられます。

…どういうこと？

難しい日本語で書くのやめてほしいですね。。

要は単純な形式で置換する場合ってことです。

str.replace('-','');

最初に出てきたものだけが置き換えられます。

とのことなので複雑な条件は難しそうです。

使いみちとしては単純な置き換えってことですかね。

第2引数(置き換えるやつ)

newSubStr

置き換えることのできる特別な文字列。

文字列です。

が！ちょっと特殊です。

$1とかで置き換えをすることができます。

変数みたいですね。

最初は少し奇妙に思えました。

var re = /(\w+)\s(\w+)/;
var str = 'John Smith';
var newstr = str.replace(re, '$2, $1');
console.log(newstr);  // Smith, John

furnction

複雑な条件を指定する場合は関数をあてがいます。

第二引数として関数を指定することができます。このとき、関数はマッチが完了された後に実行されます。

関数呼び出しの結果（返り値）は、置換文字列として使われます（注記: 上記の特殊な置換パターンはこの場合には適用されません）。

第一引数の正規表現がグローバルだと、置換されるべきマッチごとに関数が複数回実行されうることに注意してください。

具体的にはこんな感じ。

function replacer(match, p1, p2, p3, offset, string) {
  // p1 is nondigits, p2 digits, and p3 non-alphanumerics
  return [p1, p2, p3].join(' - ');
}
var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer);
console.log(newString);  // abc - 12345 - #$*%

まとめ

最初いみわからんちん状態でしたけど

自分でまとめたら少し理解できるようになった気がします。

参考

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/replace