JavaScriptのreplaceの第3引数にg,iなどを指定してはいけない

replaceの第3引数について

FirefoxだとJavaScriptのreplaceの第3引数にg,iなどのフラグ(オプション)を指定することができる。

よってFirefoxだと下記の2つの記述は同じ結果になる。

var str = 'I have apple and green apple';
var str1 = str2 = str;
console.log(str1.replace(/apple/gi, 'banana'));
// => 'I have banana and green banana'
console.log(str2.replace('apple', 'banana', 'gi'));
// => 'I have banana and green banana'

ただし、このように同じような結果になるのはFirefoxだけである。IE, Chrome, Safari, Operaなどでは第3引数に'gi'を指定しても適用されないため結果は'I have banana and green apple'となる。

JavaScriptのコードを見ているとたまにreplaceの第3引数に'gi'を指定している記述を見かける。なぜことような記述が存在するのか調べてみたら理由は単純だった。

検索結果第1位のサイトが…

Googleで「JavaScript replace」で検索するとMDNのreplaceの説明をしているサイトが検索結果第1位に表示される。

こちらのサイトには/apples/giと記述したサンプルと第3引数に'gi'を指定したサンプルがあり、さらに補足に

これらの例は、両方とも、"oranges are round, and oranges are juicy." を出力します。

と書かれているため、これを見てほかのブラウザでも使用できると勘違いされることがあるようだ。

一応ページの上の方に

注記: flags 引数は v8 Core (Chrome や Node.js) では機能しません。

と書かれてはいるが場所が離れているため気づかれにくく、初心者にはわかりにくい。

まとめ

replaceに第3引数でgiを指定できるのはFirefoxだけなので使用するのはやめたほうが良い。