JavaScriptの正規表現で全てのマッチを取得する方法
先生と生徒の会話形式で理解しよう
生徒
「先生、JavaScriptで文章の中にある特定の単語を全部見つけたいです。」
先生
「それなら正規表現のgフラグを使って全てのマッチを取得できます。gはグローバルの意味で、最初の1回だけではなく文章全体を検索するために使います。」
生徒
「具体的にはどう書けば良いですか?」
先生
「matchメソッドを使う方法と、execを繰り返し使う方法があります。それぞれ見ていきましょう。」
1. matchメソッドで全てのマッチを取得する
文字列のmatchメソッドに正規表現を渡すと、一致した部分を配列で取得できます。gフラグを付けると全てのマッチを取得します。
const text = "JavaScriptは楽しいです。JSも楽しいです。";
const regex = /楽しい/g;
const matches = text.match(regex);
console.log(matches); // ["楽しい","楽しい"]
このように、文章の中に複数ある「楽しい」という単語を全て取得できます。
2. execメソッドで順番にマッチを取得する
execメソッドは正規表現オブジェクトに対して使います。gフラグを付けると、呼ぶたびに次のマッチを取得でき、ループで全て取得可能です。
const regex = /楽しい/g;
let match;
while ((match = regex.exec(text)) !== null) {
console.log(match[0], "が見つかりました。位置:", match.index);
}
出力結果では、それぞれの単語が文章のどの位置にあるかも確認できます。これによりマッチの位置情報が必要な場合に便利です。
3. 大文字小文字を区別せず全て取得する
正規表現にiフラグを追加すると、大文字小文字を区別せずに検索できます。gと組み合わせることで、文章全体から全てのマッチを取得可能です。
const text = "JavaScriptは楽しいです。JSも楽しいです。";
const regex = /js/gi;
const matches = text.match(regex);
console.log(matches); // ["JS"]
これで「js」「JS」の両方を同時に取得できます。
4. 動的に文字列から正規表現を作る場合
ユーザー入力など文字列から正規表現を作る場合は、RegExpコンストラクタを使います。特殊文字のエスケープも忘れずに行いましょう。
const userInput = "楽しい";
const escaped = userInput.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
const regex = new RegExp(escaped, "g");
const matches = text.match(regex);
console.log(matches); // ["楽しい","楽しい"]
ユーザーが入力した文字列を安全に正規表現に変換して全てのマッチを取得できます。
5. 注意点と使い分け
matchは一致部分のみを配列で取得したい場合に便利execは一致部分の位置情報が必要な場合に便利gフラグを忘れると最初の1回しかマッチしません- ユーザー入力を正規表現に使う場合は特殊文字を必ずエスケープする
これらを理解すると、文章中の特定の単語やパターンを効率よく全て取得できます。