RegExp.escape()ヘルパーとは
RegExp.escape(string)は、すべての特殊な正規表現文字をバックスラッシュでエスケープした新しい文字列を返す静的メソッドです。これにより、ユーザー入力から動的パターンを構築する際に、RegExpコンストラクタ内で安全に文字列を使用できます。このメソッドはBaseline 2025(Chrome 132+)の一部であり、開発者が何十年も書いてコピーしてきたエラーが発生しやすい手動エスケープ関数を置き換えます。
クイックアンサー
RegExp.escape(string)を使用して、動的なRegExpパターンを構築する前に、ユーザー入力内の特殊な正規表現文字を安全にエスケープします。14個すべての正規表現メタ文字をサポートしています。Chrome 132+、Edge、Firefox、Node.js 20+で利用可能。もう手動のエスケープ正規表現チェーンは必要ありません。
Last updated: 2026-06-02
制限事項
- Baseline 2025をサポートしていない環境では利用できません。古いNode.jsバージョンやレガシーブラウザには、ポリフィルまたは従来の手動置換関数を使用してください。
- RegExp.escape()は文字列入力のみを処理します。RegExpフラグやパターンオプションについては、自分で完全なパターン文字列とフラグ配列を構築する必要があります。
- このメソッドはすべての特殊文字を無条件にエスケープします。リテラルユーザー入力と意図的な正規表現構文(ワイルドカードなど)を混在させるパターンを構築する必要がある場合は、意図的な構文を個別に処理する必要があります。
Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub
使い方
- 検索ボックスやフィルター入力など、ユーザー提供または変数の入力からRegExpパターンを構築する必要がある場所を特定します。
- RegExpコンストラクタのパターン文字列に挿入する前に、入力文字列をRegExp.escape()に渡します。
- エスケープされた文字列をRegExpパターンで使用します:new RegExp(RegExp.escape(userInput), 'gi')。
- ツール出力に含まれる生成コードを確認します。ネイティブメソッドと比較用の手動エスケープ関数の両方が表示されます。
主な用途
- ユーザーのキーストロークをライブフィルタリング用の正規表現に変換するクライアントサイド検索フィルターを構築します。エスケープにより、無効または注入されたパターンが正規表現を壊すのを防ぎます。
- ユーザーが検索するリテラル文字列と置換を入力する検索置換UIを作成します。エスケープにより、.や*などの文字がリテラルとして扱われることを保証します。
- ユーザー入力からRegExpを構築し、マッチをspanでラップすることでテキストコンテンツ内の検索語を強調表示します。エスケープによりパターンの構文が有効であることが保証されます。