【JSリファレンス】String.prototype.replace()
更新日：2024/06/14
String.prototype.replace()は、Stringオブジェクト(Stringコンストラクターのインスタンス)のプロトタイプチェーンに組み込まれるメソッドです。
文字列から特定の文字列を検索して任意の文字列で置き換えた結果を返します。
■構文
String.prototype.replace ( searchValue, replaceValue )
文字列またはgフラグを含まないRegExpオブジェクトを指定した場合、置換されるのは最初に一致した文字列のみです。
２番目以降を一致させる場合、gフラグを含んだRegExpオブジェクトを指定します。
searchValueがRegExpオブジェクトの場合、置換処理はRegExpオブジェクトの[Symbol.replace]()メソッドが行います。
実際にはオブジェクトが[Symbol.replace]()メソッドを所持していれば、そのメソッドが呼び出されます。
その際の戻り値は、メソッドに一任されます。
引数が[Symbol.replace]()を持つがRegExpオブジェクトでない場合、そのメソッドの戻り値
■置換文字列について
検索する値が文字列またはRegExpオブジェクトのとき、置換文字列は次の意味がある文字列パターンを含むことができます。
| 文字列パターン | 意味 | 例 |
|---|---|---|
| $& | 一致した文字列 | "abcabc".replace("b","$&$&$&") → "abbbcabc" "abcabc".replace(/b/g,"$&$&$&") → "abbbcabbbc" |
| $` (バック クオート) | 一致した文字列の 前方文字列 | "abcabc".replace( "b" , "$`") → "aacaabcac" "abcabc".replace( /b/g , "$`") → "aacaabcac" |
| $' (シングル コーテーション) | 一致した文字列の 前方文字列 | "abcabc".replace( "b" , "$'") → "acabccabc" "abcabc".replace( /b/g , "$'") → "acabccacc" |
| $$ | "$"に置き換え | "abcabc".replace( "b" , "$$") → "a$cabc" "abcabc".replace( /b/g , "$$") → "a$ca$c" |
検索する値がRegExpオブジェクトのとき、次のパターンを追加で使用できます。
| 文字列パターン | 意味 | 例 |
|---|---|---|
| $n (nは数値) | n番目の キャプチャ文字 | "abcabc".replace( /(a)(b)(c)/g , "$3$2$1") → "cbacba" |
| $<Name> (Nameはグループ名) | Nameに対応する キャプチャ文字 | "abcabc".replace( /(?<n1>a)(?<n2>b)(?<n3>c)/g , "$<n3>$<n2>$<n1>") → "cbacba" |
■replaceValue関数について
引数replaceValueが関数の場合、検索対象の文字列を受け取り置き換え後の文字列を返します。
searchValueが文字列かRegExpオブジェクトかで、replaceValue関数の引数が変わります。
▶テキストの場合の構文
replaceValue( text , index , alltext )
- text: 一致した文字列
- index: 一致した位置
- alltext: 置換対象の文字列全体
▶RegExpオブジェクトの場合の構文
replaceValue( text , p1 , p2 , ... pn , index , alltext ,group )
- text: 一致した文字列
- index: 一致した位置
- p1 , p2 , ... pn : キャプチャグループ
- alltext: 置換対象の文字列全体
- group: グループ名をプロパティ名にキャプチャ値をプロパティ値に持つオブジェクト
■使用例
▶ 一部のアルファベットを大文字に変換
const text = "abcdefg".replace(/[aceg]/g,a=>a.toUpperCase());
console.log( text ); // AbCdEfG
関連ページ
●【JavaScript】 replaceAllとは replaceとの違い
●【JavaScript】 replace()の使い方 単純な置換と正規表現での置換
●【JavaScript】全角数字または全角漢数字を半角数字に変換する
●【JavaScript】htmlタグのエスケープ処理はちょっと難しいので整理してみる
更新日：2024/06/14
スポンサーリンク
記事の内容について
こんにちはけーちゃんです。
説明するのって難しいですね。
「なんか言ってることおかしくない？」
たぶん、こんなご意見あると思います。
裏付けを取りながら記事を作成していますが、僕の勘違いだったり、そもそも情報源の内容が間違えていたりで、正確でないことが多いと思います。
そんなときは、ご意見もらえたら嬉しいです。
掲載コードについては事前に動作確認をしていますが、貼り付け後に体裁を整えるなどをした結果動作しないものになっていることがあります。
生暖かい視線でスルーするか、ご指摘ください。
ご意見、ご指摘はこちら。
https://jsref.affi-sapo-sv.com/info.php
このサイトは、リンクフリーです。大歓迎です。
