>> JavaScript入門トップに戻る
今回は正規表現について説明します。
正規表現とは、文字列をある形式に沿って表現する方法です。
たとえば、「12345」という文字列は正規表現で、
[1-5]+
という正規表現にマッチします。
これは1~5までの数字を1回以上繰り返すという意味を持っています。
つまり、「12345」という文字列にマッチするわけです。
なんとなく正規表現というものがどういうものか掴めましたでしょうか?
このように[1-5]や+などの専用の記号を使って、文字を表すことができます。
色々記号があるので紹介します。
他にも沢山ありますが、よく使うのはこれぐらいです。
下記のコードを見てください。
↑のボタンをクリックして下さい。
このサイトのTOPのURLと、http://を除いた部分が表示されましたよね?
それではコードの解説を行います。
正規表現で該当の文字列がマッチしているかを調べるには、
match関数を使います。
書き方は、
文字列変数.match(/正規表現/オプション)
です。文字列変数から呼び出すことが出来ます。
正規表現部分はスラッシュで囲みます。オプションには以下の三つがあります。
・g
→複数回マッチします。
・i
→大文字小文字関係なくマッチします
・m
→複数行にもマッチします。
オプションgは文字列の最初の方でマッチしたとしても、
他にマッチするものがないか末尾まで検索し続けるということです。
オプションiは正規表現で[a-z]と指定したとしても、大文字のA-Zもマッチするということです。
オプションmはたとえば複数行の文字列を検索しようとした場合に、
このオプションをつけなければ、^などの正規表現は先頭を意味するので、一番最初の文字しかひっかかりませんが、
このオプションをつけると、次の行も先頭としてみなされ、^の表現にマッチしてくれます。
正規表現部分の解説をします。
【^http:\/\/】までの部分でhttp://までの文字を表現しています。
スラッシュの前に\が付いてるのは、スラッシュを文字として見なすためです。
\がないとサイドのスラッシュと間違われてしまうからです。
次に、【([\/a-z\.]+)】の部分ですが、
スラッシュとa-zとドットの文字がurlには含まれてますよね?
それを[]の中で表しています。
\が付いて分かりにくいかもしれませんが、正規表現を文字として扱いたい場合は\をつけます。
スラッシュとかドットは文字として扱ってるので\をつけてるわけです。
つまり、
[/a-z.]ということです。
さらにこれに+をつけることで、
[/a-z.]のどれかの文字を1回以上繰り返す、という意味になります。
これでhttp://以下の文字列は表せますね?
さらにその領域をグループ化するために()でくくっています。
こうやってくくっておくと、後からこの領域だけを簡単に取り出すことが出来ます。
今回はオプションgをつけているので、複数マッチした場合は、その結果が配列として返ります。
次のforループで、
mat配列の要素数の数だけループしています。(配列は.lengthプロパティで要素数を取得できる)
今回はマッチしたのは一つだったので、一回しか表示されませんでしたが、
複数マッチした場合には、マッチした数だけ要素があります。
最後に、
alert(RegExp.$1);
と書いてますが、これはグループ化した部分を表示させています。
つまり()で囲った部分です。
グループ化した部分は【RegExp.$数字】というオブジェクトのメンバに順番に格納されていきます。
今回は一つしかグループ化していませんでしたが、二つ以上グループ化した場合は、
$2,$3と増えていきます。
なので、今回はhttp://以下の部分だけが表示されたというわけです。
このように正規表現を組み合わせることで、特定の部分だけ文字列を取り出したりすることが出来ます。
次回は正規表現に変数を使って、指定する方法を説明します。
>> 【正規表現【変数による指定】】に進む
>> JavaScript入門トップに戻る
正規表現
正規表現とは、文字列をある形式に沿って表現する方法です。
たとえば、「12345」という文字列は正規表現で、
[1-5]+
という正規表現にマッチします。
これは1~5までの数字を1回以上繰り返すという意味を持っています。
つまり、「12345」という文字列にマッチするわけです。
なんとなく正規表現というものがどういうものか掴めましたでしょうか?
このように[1-5]や+などの専用の記号を使って、文字を表すことができます。
色々記号があるので紹介します。
記号 | 意味 | 書き方 |
---|---|---|
[] | 括弧内の文字のいずれかを表します | [a-z]ならアルファベットa~zまでマッチ [0-9a-z]なら、0~9a~zまで全部マッチ |
[^] | 括弧内の文字以外を表します | [^a-z],[^0-9a-z] |
. | 改行文字を除く任意の一文字を表します | . |
+ | 直前の文字を1回以上繰り返す | + |
* | 直前の文字を0回以上繰り返す | * |
^ | 直後の文字から始まる | ^ |
$ | 直前の文字で終わる | $ |
() | 指定した領域をグループ化 | ([0-9a-z]) |
\n | 改行 | \n |
\t | タブ | \t |
\r | リターン | \r |
\d | 数字 | \d |
\D | 数字以外 | \D |
\s | 空白文字(スペース、改行、タブ) | \s |
\S | 空白以外 | \S |
? | 直前の文字が0か1個 | ? |
\ | メタ文字(正規表現で使われてる文字)の直前に置き、 それを文字として扱う。 |
\ |
他にも沢山ありますが、よく使うのはこれぐらいです。
下記のコードを見てください。
function CheckTest(){ var test="http://bituse.info/"; var mat=test.match(/^http:\/\/([\/a-z\.]+)/gim); //マッチしたものを全て表示 for(var i=0;i<mat.length;++i){ alert(mat[i]); } //()で囲ってグループ化した部分を表示。 alert(RegExp.$1); }
↑のボタンをクリックして下さい。
このサイトのTOPのURLと、http://を除いた部分が表示されましたよね?
それではコードの解説を行います。
正規表現で該当の文字列がマッチしているかを調べるには、
match関数を使います。
書き方は、
文字列変数.match(/正規表現/オプション)
です。文字列変数から呼び出すことが出来ます。
正規表現部分はスラッシュで囲みます。オプションには以下の三つがあります。
・g
→複数回マッチします。
・i
→大文字小文字関係なくマッチします
・m
→複数行にもマッチします。
オプションgは文字列の最初の方でマッチしたとしても、
他にマッチするものがないか末尾まで検索し続けるということです。
オプションiは正規表現で[a-z]と指定したとしても、大文字のA-Zもマッチするということです。
オプションmはたとえば複数行の文字列を検索しようとした場合に、
このオプションをつけなければ、^などの正規表現は先頭を意味するので、一番最初の文字しかひっかかりませんが、
このオプションをつけると、次の行も先頭としてみなされ、^の表現にマッチしてくれます。
正規表現部分の解説をします。
【^http:\/\/】までの部分でhttp://までの文字を表現しています。
スラッシュの前に\が付いてるのは、スラッシュを文字として見なすためです。
\がないとサイドのスラッシュと間違われてしまうからです。
次に、【([\/a-z\.]+)】の部分ですが、
スラッシュとa-zとドットの文字がurlには含まれてますよね?
それを[]の中で表しています。
\が付いて分かりにくいかもしれませんが、正規表現を文字として扱いたい場合は\をつけます。
スラッシュとかドットは文字として扱ってるので\をつけてるわけです。
つまり、
[/a-z.]ということです。
さらにこれに+をつけることで、
[/a-z.]のどれかの文字を1回以上繰り返す、という意味になります。
これでhttp://以下の文字列は表せますね?
さらにその領域をグループ化するために()でくくっています。
こうやってくくっておくと、後からこの領域だけを簡単に取り出すことが出来ます。
今回はオプションgをつけているので、複数マッチした場合は、その結果が配列として返ります。
次のforループで、
mat配列の要素数の数だけループしています。(配列は.lengthプロパティで要素数を取得できる)
今回はマッチしたのは一つだったので、一回しか表示されませんでしたが、
複数マッチした場合には、マッチした数だけ要素があります。
最後に、
alert(RegExp.$1);
と書いてますが、これはグループ化した部分を表示させています。
つまり()で囲った部分です。
グループ化した部分は【RegExp.$数字】というオブジェクトのメンバに順番に格納されていきます。
今回は一つしかグループ化していませんでしたが、二つ以上グループ化した場合は、
$2,$3と増えていきます。
なので、今回はhttp://以下の部分だけが表示されたというわけです。
このように正規表現を組み合わせることで、特定の部分だけ文字列を取り出したりすることが出来ます。
次回は正規表現に変数を使って、指定する方法を説明します。
>> 【正規表現【変数による指定】】に進む
>> JavaScript入門トップに戻る