JavaScriptの正規表現を文字列に動的に組み込む方法（RegExpコンストラクタ）

先生と生徒の会話形式で理解しよう

生徒

「先生、JavaScriptで正規表現を文字列として作りたいんですが、どうすれば良いですか？」

先生

「それにはRegExpコンストラクタを使います。通常のスラッシュ記法とは違い、文字列から正規表現を動的に作ることができます。」

生徒

「具体的にどんな場面で使うんですか？」

先生

「例えば、ユーザーが入力した文字列をパターンにして検索したい場合などです。固定の正規表現では対応できない場面で便利です。」

1. RegExpコンストラクタとは？

JavaScriptのRegExpコンストラクタは、文字列から正規表現オブジェクトを作るための方法です。通常はスラッシュで囲む方法 /abc/ がありますが、RegExpを使うと動的に文字列をパターンとして指定できます。


const pattern = "abc";
const regex = new RegExp(pattern);
console.log(regex.test("abcdef")); // true

上記の例では、文字列patternから正規表現を作り、文字列"abcdef"がマッチするか確認しています。

2. フラグを使ったRegExpの作り方

正規表現にはフラグという設定があります。iは大文字小文字を区別しない、gは全体検索を意味します。RegExpコンストラクタでもフラグを文字列で指定できます。


const pattern = "abc";
const regex = new RegExp(pattern, "gi");
console.log("ABC abc".match(regex)); // ["ABC","abc"]

このようにフラグを指定することで、動的に作った正規表現でもスラッシュ記法と同じ効果を得られます。

3. 特殊文字を含む文字列を正規表現にする場合

正規表現には.や?などの特殊文字があります。文字列としてこれらをそのまま使用すると意図しない動作になります。特殊文字を無効化するにはエスケープが必要です。


const userInput = "a.b";
const escaped = userInput.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
const regex = new RegExp(escaped);
console.log(regex.test("a.b")); // true

上記の方法でユーザー入力などに含まれる特殊文字も安全に正規表現に組み込めます。

4. 動的な検索に使う例

たとえば、検索フォームでユーザーが入力した文字列を正規表現にして文章から抽出する場合に便利です。


function searchText(text, keyword) {
  const escaped = keyword.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
  const regex = new RegExp(escaped, "gi");
  return text.match(regex);
}

const result = searchText("JavaScriptは楽しいです。JSは便利です。", "js");
console.log(result); // ["JS"]

この例ではユーザー入力のkeywordを安全に正規表現に変換し、文章中で一致する部分を取得しています。