本文へスキップ

正規表現の解説

Regex Explainer

正規表現を名前の付いた木に分解し、どの部分が何を捕まえるのかを読めるようにします。

正規表現を木に分解し、それぞれの部分が何をするのかを述べます。グループ、量指定子、文字クラス、アサーションのすべてを、パターンどおりに入れ子にして示します。テスターと同じ画面を、解説のタブで開いたものです。パターンを読むことと動かすことは、同じ活動だからです。

🔒 ブラウザの中だけで動きますregexexplainlearn
表示

パターン

//g

文字列のどこでも一致可能、キャプチャグループ 2 個。

各部分のはたらき

([\w.+-]+)@([\w-]+\.[\w.-]+)順番に

これらが、あいだに何も挟まずに順番にすべて一致しなければなりません。

([\w.+-]+)1番のキャプチャグループ

中のパターンに一致させ、その文字列を覚えておきます。`match[1]` として、置換文字列では `$1` として使えます。

[\w.+-]++ の分だけ繰り返し

1 回以上繰り返しますが、できるだけ多く取り、後ろが失敗したときだけ譲ります。

[\w.+-]この集合に入っている文字ひとつ

ちょうど一文字に一致します。下のうち入力に先に現れたものが取られます。

クラスの中では `.` は句点です。ここでは「任意の文字」という意味にはならず、エスケープしても変わりません。

\w任意の単語文字

ちょうど `[A-Za-z0-9_]` です。

ASCII だけです。JavaScript の正規表現にとって `é`、`한`、`ß` は単語文字ではないので、`\w+` は韓国語やアクセント付きの語に一致しません。

.“.” (U+002E) という文字

大文字と小文字まで含めてそのまま合わせます。

+“+” (U+002B) という文字

大文字と小文字まで含めてそのまま合わせます。

-“-” (U+002D) という文字

大文字と小文字まで含めてそのまま合わせます。

@“@” (U+0040) という文字

大文字と小文字まで含めてそのまま合わせます。

([\w-]+\.[\w.-]+)2番のキャプチャグループ

中のパターンに一致させ、その文字列を覚えておきます。`match[2]` として、置換文字列では `$2` として使えます。

[\w-]+\.[\w.-]+順番に

これらが、あいだに何も挟まずに順番にすべて一致しなければなりません。

[\w-]++ の分だけ繰り返し

1 回以上繰り返しますが、できるだけ多く取り、後ろが失敗したときだけ譲ります。

[\w-]この集合に入っている文字ひとつ

ちょうど一文字に一致します。下のうち入力に先に現れたものが取られます。

\w任意の単語文字

ちょうど `[A-Za-z0-9_]` です。

ASCII だけです。JavaScript の正規表現にとって `é`、`한`、`ß` は単語文字ではないので、`\w+` は韓国語やアクセント付きの語に一致しません。

-“-” (U+002D) という文字

大文字と小文字まで含めてそのまま合わせます。

\.“.” (U+002E) という文字

大文字と小文字まで含めてそのまま合わせます。

ここでは、このバックスラッシュは要りません。この位置でこの文字は特別な意味を持ちません。

[\w.-]++ の分だけ繰り返し

1 回以上繰り返しますが、できるだけ多く取り、後ろが失敗したときだけ譲ります。

[\w.-]この集合に入っている文字ひとつ

ちょうど一文字に一致します。下のうち入力に先に現れたものが取られます。

クラスの中では `.` は句点です。ここでは「任意の文字」という意味にはならず、エスケープしても変わりません。

\w任意の単語文字

ちょうど `[A-Za-z0-9_]` です。

ASCII だけです。JavaScript の正規表現にとって `é`、`한`、`ß` は単語文字ではないので、`\w+` は韓国語やアクセント付きの語に一致しません。

.“.” (U+002E) という文字

大文字と小文字まで含めてそのまま合わせます。

-“-” (U+002D) という文字

大文字と小文字まで含めてそのまま合わせます。

フラグ

g — global
最初の一致で止まらず、すべてを見つけます。その代わり `.test()` と `.exec()` が呼び出しのあいだ `lastIndex` を動かすので、「一回おきに失敗する」という症状はたいていこれが原因です。

使い方

  1. 引き継いだパターンを貼り付けます

    誰も書いた覚えのない、設定ファイルの中のあれです。パターンマッチではなくパースをしているので、分解は実際の構造に沿います。

  2. 木を上から読み下します

    ノードごとに、元の断片、それが何であるか、何をするのかが出ます。よく人を驚かせる部分——入れ子の量指定子、必要が無いのにキャプチャしているグループ——には注記が付きます。

  3. テストに切り替えて、読みを確かめます

    パターンはそのまま引き継がれます。正規表現を理解することと、思ったとおりに動くと確かめることは別々の工程で、安上がりなのは2つ目です。

よくある質問

入れ子の量指定子に出る警告は何を意味しますか

`(a+)+`のようなものは、同じテキストを分ける方法を指数関数的にたくさんエンジンに与えるので、一致しない入力に対して宇宙の年齢より長くかかることがあります。正規表現によるサービス拒否の大半の背後にある形です。

グループがキャプチャしていると教えてくるのはなぜですか

使わないキャプチャグループは枠を1つ消費し、使うほうの番号をずらしてしまうからです。`(?:…)`はキャプチャせずにまとめるので、`$1`が意図したものを指したままになります。

フラグの解説もありますか

あります。専用のパネルに、立てているフラグごとに、その名前と、何を変えるのかが出ます。とくに`m`と`s`は読む値打ちがあります。名前が、互いの振る舞いを連想させるものになっているからです。

ここから渡せます

次の一手

このツールが出したものをそのまま受け取れる道具です。