正規表現をオンラインでテストする方法(実例つき)
正規表現をテストするとは、パターンを書き、必要なフラグを選び、テスト文字列に対して実行し、ハイライトされた一致箇所とキャプチャグループの中身の両方を確認してから、実際のコードに組み込む作業のことです。頭の中だけで正規表現の動きを追うのは難しく、想定していなかった文字列にまでマッチしてしまうことも珍しくありません。実際に動かして目で見るのが一番早い確認方法です。
パターンとフラグの読み方
正規表現ツールでは、パターンは/と/のあいだに書きます。例えば/\d+/は数字の連続にマッチするパターンです。パターンの右側には0個以上のフラグを付けられます。
- g(グローバル): 最初の一致だけで止まらず、文字列内のすべての一致を探します。
- i(大文字小文字を区別しない):
Aとaを同じものとして扱います。 - m(複数行):
^と$が文字列全体の先頭・末尾ではなく、各行の先頭・末尾にマッチするようになります。 - s(dotAll): 通常
.は改行にはマッチしませんが、このフラグを付けると改行文字も含めて任意の1文字にマッチします。
パターンの中で()を使うと、その部分だけを取り出して後から参照できます。これがキャプチャグループです。(?<year>\d{4})のように名前を付けた名前付きグループも使え、match.groups.yearのような形で結果にアクセスできるようになります。番号だけの無名グループより、パターンが長くなったときに何を取り出しているか分かりやすいのが利点です。
実例で確認する
以下の4つのパターンで、パターン・フラグ・マッチする例・マッチしない例・キャプチャの内容を整理しました。
| パターン | フラグ | マッチする | マッチしない | キャプチャ |
|---|---|---|---|---|
^[\w.+-]+@[\w-]+\.[a-zA-Z]{2,}$ | なし | [email protected] | jane@example(トップレベルドメインがない) | なし |
#([0-9a-fA-F]{6}|[0-9a-fA-F]{3}) | g | #2F7BFF、#fff | #12G456(Gは16進数ではない) | グループ1: 2F7BFF |
\/(\w+)\/(\w[\w-]*) | g | /users/123、/products/abc-456 | /users(第2セグメントがない) | グループ1: リソース種別、グループ2: ID |
^\d{4}-\d{2}-\d{2}$ | なし | 2026-07-11 | 07/11/2026(フォーマットが違う) | なし |
REST風のパス\/(\w+)\/(\w[\w-]*)から見ていきます。\/はスラッシュそのものにマッチし、続く(\w+)が最初のグループで、英数字とアンダースコアの連続、つまりusersやproductsのようなリソース名を1文字以上取り込みます。次の\/でもう一段区切り、(\w[\w-]*)が第2グループで、最初の1文字は英数字、そのあとはハイフンも許可した文字が続きます。だからこそabc-456のようなハイフン入りのIDも1つのグループとして拾えます。gフラグを付けているのは、1つの文字列に複数のパスセグメントが含まれるログ行などから、すべてのマッチを一括で取り出したいからです。ルーティング設定を検証するとき、グループ1を「このリソース種別は許可リストに存在するか」、グループ2を「このIDは正しい形式か」という2段階のチェックに分けて使う、といった使い方ができます。
16進数カラーコード#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})は、#のあとに6桁または3桁の16進数が続くパターンです。カッコの中の|は「どちらか」を意味し、[0-9a-fA-F]{6}(フルの6桁表記)か[0-9a-fA-F]{3}(#fffのような短縮表記)のいずれかにマッチします。ここでgフラグが特に効いてくるのは、1つのCSSファイルの中に複数の色定義が並んでいる場合です。gフラグなしだと最初に見つかった#2F7BFFだけで探索が止まってしまい、そのあとに出てくる#fffは見落とされます。gフラグを付けてループで実行すれば、ファイル内のブランドカラーを一度にすべて洗い出せます。グループ1にはマッチした16進数部分だけが入るので、先頭の#を除いた値をそのまま別の場所(例えばデザインシステムのトークン一覧)にコピーするといった用途に使えます。
自分のパターンを試す
上の表の例だけでなく、自分が書きたいパターンをそのまま貼り付けて、実際の一致を確認してみてください。
よくある間違いとエッジケース
gフラグを忘れる。 これがないと最初の一致で止まってしまい、すべての出現を期待する処理(例えば全置換)が静かに壊れる。パターン自体は正しいのに、2件目以降の一致だけが処理されずに残るというバグは、見た目では気づきにくいので厄介です。
エスケープされていないピリオド。 エスケープしていない.はリテラルなピリオドではなく、任意の1文字にマッチする。192.168.1.1というパターンは192X168X1X1にもマッチしてしまう。リテラルなピリオドには\.を使う。IPアドレスやバージョン番号を扱うパターンでは特に見落としやすいポイントです。
貪欲な量指定子と遅延量指定子。 .*は可能な限り多く取得する(貪欲)ため、意図した範囲をはるかに超えてマッチすることがある。例えばHTMLブロック全体で、最初の<から最後の>までマッチしてしまい、1つのタグだけにマッチしない。.*?(遅延)は可能な限り早い時点で止まる。1つのタグだけを抜き出したい場合は、貪欲な量指定子ではなく遅延量指定子を選ぶ必要があります。
アンカーの欠落。 ^と$がないと、パターンはテキストのどこでも部分文字列としてマッチしうるため、アンカーのない「検証」パターンは有効な部分を含むだけの文字列を通してしまい、無効な入力が漏れる。^と$は文字列全体のマッチを強制する。フォーム入力の検証など、文字列全体が条件を満たしているかを確認したい場面では、このアンカーの有無が結果を大きく左右します。
よくある質問
gフラグを使う場合と使わない場合の実際の違いは何ですか? gフラグなしでは、パターンは文字列内で最初に見つかった一致だけを返し、それ以降の探索を行いません。gフラグを付けると、文字列の終わりまで探索を続け、見つかったすべての一致を返します。1件だけ確認できればよい場合はgフラグなし、置換や集計のようにすべての出現を扱いたい場合はgフラグ付き、という使い分けになります。
ピリオドやドル記号、括弧などのリテラルな特殊文字にマッチさせるにはどうすればよいですか?
正規表現で特別な意味を持つ文字(. * + ? ^ $ ( ) [ ] { } | \など)をそのままの文字として扱いたいときは、直前にバックスラッシュを置いてエスケープします。例えば価格の$にマッチさせたいなら\$、丸括弧そのものにマッチさせたいなら\(と\)のように書きます。
非キャプチャグループ(?:...)とは何ですか、通常の(...)グループの代わりにいつ使うべきですか?
(?:...)はカッコの中身をひとまとまりとして扱いつつ、そのマッチ結果を後から参照できる形では残さないグループです。単に|の適用範囲を区切りたいだけで、そのグループの中身自体は取り出す必要がない場合に使います。例えば(?:https?|ftp):\/\/のようにプロトコル部分をまとめたいだけなら非キャプチャグループで十分で、キャプチャグループの番号がずれるのも防げます。実際に値を取り出したいグループだけを通常の(...)にすると、結果の見通しがよくなります。
このツールはパターンやテスト文字列をどこかに送信しますか? いいえ、すべてブラウザ内蔵のJavaScript RegExpエンジンで処理され、サーバーには何も送信されません。入力した内容はその場でブラウザ内だけで評価されます。