+7(903)-123-45-67 という文字列があり、すべての文字を見つけたいとします。しかし、以前とは違い、数字だけでなく完全な数字が欲しいです: 7, 903, 123, 45, 67。
数字は1つ以上の \d の連続です。どれだけ必要かを示す手段は 量指定子 と呼ばれます。
量指定子 {n}
最も明白な量指定子は、波括弧の数字です: {n}。量指定子は文字(または文字クラスなど)の後に置かれ、正確にどれだか必要かを指定します。
また、高度なフォームも持っています。ここでその例を挙げます:
- 正確なカウント:
{5} -
\d{5}は正確に5桁であることを示し、\d\d\d\d\dと同じです。下の例では 5桁の数値を探します:
alert( "I'm 12345 years old".match(/\d{5}/) ); // "12345"\bを追加してより長い数字を除外することもできます:\b\d{5}\b. - from-to のでカウント:
{3,5} -
3桁 から 5桁の数値を探すには、波括弧の中に制限を入れることができます:
\d{3,5}alert( "I'm not 12, but 1234 years old".match(/\d{3,5}/) ); // "1234"上限を省略することができます。正規表現
\d{3,}は3桁以上の数字を探します:alert( "I'm not 12, but 345678 years old".match(/\d{3,}/) ); // "345678"
文字列 +7(903)-123-45-67 のケースでは、私たちは数値が必要です: 連続した1桁以上の数字です。つまり \d{1,} です:
let str = "+7(903)-123-45-67";
let numbers = str.match(/\d{1,}/g);
alert(numbers); // 7,903,123,45,67簡略表記
もっとも頻繁に必要とされる量指定子には簡略表記があります:
+-
“1つ以上” を意味し、
{1,}と同じです。例えば、
\d+は数字を探します:let str = "+7(903)-123-45-67"; alert( str.match(/\d+/g) ); // 7,903,123,45,67 ?-
“0 か 1” を意味し、
{0,1}と同じです。つまりシンボルをオプションにします。例えば、パターン
ou?rはoに続く 0 または 1つのu、そして続けてrです。なので、単語
colorではorを見つけ、colourではourを見つけます。:let str = "Should I write color or colour?"; alert( str.match(/colou?r/g) ); // color, colour *-
“0 以上” を意味し、
{0,}と同じです。つまり、文字は任意の数繰り返されるか、存在しない可能性があります。下の例は、ゼロが任意の数続く数字を探します:
alert( "100 10 1".match(/\d0*/g) ); // 100, 10, 1'+'(1つ以上) と比較すると:alert( "100 10 1".match(/\d0+/g) ); // 100, 10
より多くの例
量指定子はとてもよく使われます。これらは複雑な正規表現を実現するためのメインの “ビルディングブロック” のなので、より多くの例を見ていきましょう。
- “少数” (浮動小数点を持つ数値)の正規表現:
\d+\.\d+ - 実演:
alert( "0 1 12.345 7890".match(/\d+\.\d+/g) ); // 12.345
“属性なしの HTML の開始タグ” の正規表現 (<span> や <p> など)
-
最もシンプルな方法:
/<[a-z]+>/ialert( "<body> ... </body>".match(/<[a-z]+>/gi) ); // <body>文字
'<'に続けて1つ以上の英語文字、その後'>'。 -
改良版:
/<[a-z][a-z0-9]*>/i標準では、HTMLタグ名は1文字目以外の任意の場所で数字が使えます。例:
<h1>alert( "<h1>Hi!</h1>".match(/<[a-z][a-z0-9]*>/gi) ); // <h1>
“属性なしの開始または終了 HTMLタグ” の正規表現: /<\/?[a-z][a-z0-9]*>/i
パターンの先頭付近にオプションのスラッシュ /? を追加しました。バックスラッシュでエスケープが必要です。そうしない場合、JavaScript はパターンの終わりだと認識します。
```js run
alert( "<h1>Hi!</h1>".match(/<\/?[a-z][a-z0-9]*>/gi) ); // <h1>, </h1>
```
これらの例から1つの共通するルールが見えてきます: 正規表現がより詳細/精密になるほど、パターンはより長く複雑になります。
例えば、HTMLタグはより簡単な正規表現が使えます: <\w+>.
なぜなら、\w は任意の英語文字または数字または '_' を意味するためです。また正規表現は例えば <_> のような非タグにもマッチします。しかし <[a-z][a-z0-9]*> よりもずっと簡単です。
私たちは <\w+> で良いですか？それとも <[a-z][a-z0-9]*> が必要ですか？
実際にはどちらもパターンも許容されます。“余分な” マッチや他の手段でフィルタするのが難しいかどうかという点に対してどれだけ寛容であるかによります。