Edited at

JavaScript 正規表現まとめ

More than 1 year has passed since last update.

JavaScriptの正規表現について勉強してるので忘れないうちに、まとめる。


正規表現とは


文字列内で文字の組み合わせを照合するために用いられるパターンです。

                     @正規表現 MDN web docs



簡単な例(郵便番号ver)


> var pattern = /^\d{3}-?\d{4}$/g;
> var postcode = '121-4440'; //正しい郵便番号
> var result = postcode.match(pattern);
undefined
> result
["121-4440"]

> var pattern = /^\d{3}-?\d{4}$/g;
> var postcode = '121-444'; //正しくない郵便番号
> var result = postcode.match(pattern);
undefined
> result
null

postcodeが正しい郵便番号だった場合はresultに代入され、正しくなかった場合はnullが代入される。


正規表現で利用できる主な正規表現パターン

文字
説明

ABC
「ABC」という文字列にマッチ
-

[ABC]
A,B,Cのいずれか1文字にマッチ
-

[^ABC]
A,B,C以外のいずれか1文字にマッチ
-

[A-Z]
A~Zの間の1文字
-

\
次の文字をエスケープしてくれる。
-

^
行の先頭にマッチする。
/^A/ だと "BBA" の 'A' にはマッチしないが、"ABB" の 'A' にはマッチする。

$
行の末尾にマッチする。
/A$/ だと "ABB" の 'A' にはマッチしないが、"BBA" の 'A' にはマッチする。

*
直前の文字の0回以上の繰り返しにマッチする。
/fe* / だと "f" または "fee" にマッチ。 "eee" にはマッチしない。

+
直前の文字の1文字以上の繰り返しにマッチする。
/fe+ / だと "fe","fee"にマッチ。"eee"にはマッチしない。

?
直前の文字0回か1回の出現にマッチする。
/fe? / だと"f","fe"にはマッチ。"fee"にはマッチしない。

{n}
直前の文字をn回一致
"[0-9]{3}"は3桁の数字

{n,}
直前の文字をn回以上と一致
"[0-9]{3,}"は3桁以上の数字

{m,n}
直前の文字をm~n回一致
"[0-9]{3~5}"は3~5桁の数字

.
改行文字以外のどの1文字にもマッチする。
/.n/ だと"nay an apple is on the tree"の"an","on"にはマッチする。"nay"にはマッチしない。

\w
大文字/小文字の英字、数字、アンダースコアに一致。"[A-Za-z0-9]"と同意。
-

\W
文字以外に一致。"[^\w]"と同意。
-

\d
数字に一致。"[0-9]"と同意
-

\D
数字以外に一致。"[^0-9]"と同意
-

\n
改行に一致
-

\r
復帰に一致
-

\t
タブ文字に一致
-

\s
空白文字に一致
-

\S
空白以外の文字に一致。"[^\s]"と同意。
-

~
「~」で表される文字
-


正規表現の作成には2種類ある。


正規表現リテラル


構文


var str = /正規表現/オプション;

注意:正規表現リテラルでは「/」は正規表現パターンの開始と終了を表す予約文字である。

したがって、正規表現パターンに「/」を含むものには、「\」で「\/」こんな感じでエスケープする必要がある。


RegExpオブジェクトのコンストラクターを経由する


構文

var str = new RegExp('正規表現','オプション');


注意:コンストラクター構文では、正規表現を文字列として指定している。

JavaScriptでは「\」は予約文字である。したがって、「\d」を認識させるのには「\」を、「\\」としてエスケープする必要がある。


主なオプションフラグ

オプション
説明

g
グローバルサーチ。文字列全体に対してマッチングするか(無指定の場合は1度マッチングした時点で処理を終了)

i
大文字/小文字を区別しない(無指定の場合は区別する)

m
複数行の入力文字列を複数行として扱う(^及び$が各行の先頭末尾にマッチする)

u
Unicode対応(漢字などを認識してくれるようになる)


正規表現を使用するメソッド


1.matchメソッド


構文

str.match(pattern) //str:検索対象文字列  pattern:正規表現

//例
> var str = "ABCDEFG"
> var result = str.match(/[a-c]/gi);
undefined
> console.log(result);
(3) ["A", "B", "C"]


matchメソッドは、正規パターンにマッチした文字列を配列で返す。マッチしない場合はnullを返す。gオプションを含んでる場合のみ、マッチする全てを含む配列を返します。


2.execメソッド


構文

regexp.exec(str) //regexp:正規表現 //str:検索対象文字列

//例
> var result = /(.+)cde(f)/.exec("abcdefg");
undefined
> console.log(result);
(3) ["abcdef", "ab", "f", index: 0, input: "abcdefg", groups: undefined]


matchメソッドと基本的には同じである。返した配列の[0]には最後にマッチした文字。[1]以降は、( )で囲まれた部分の文字列のマッチがセットされる。マッチしない場合は、nullを返す。


3.testメソッド


構文

regexp.test(str) //regexp:正規表現 str:検索対象文字列

//例
> var result = /[0-9]{3}/.test(999);
undefined
> console.log(result);
true


与えられた文字列を検索し、true/falseで返す。

正規表現でマッチした文字列を抽出するには、String.match/RegExp.execメソッドを使用するが、マッチしてるかどうかを調べるだけならRegExp.testメソッドを使うのが一番簡単。


4.searchメソッド


構文

str.search(pattern) //str:検索対象文字列 pattern:正規表現

//例
> var str = "ABCDEFG";
> var result = str.search(/DEF/);
undefined
> console.log(result);
3


String.searchメソッドは、指定された正規表現で最初にマッチした文字位置を返す。

マッチした文字列が存在しない場合は、戻り値として-1を返す。


5.replaceメソッド


構文

str.replace(pattern,rep) //str:置き換え対象文字列 pattern:正規表現 rep:置き換え後文字列

//例
var data = "090-1234-5678";
var secret_data = data.replace(/^\d{3}-\d{4}-\d{4}$/, '***-****-****');

console.log(secret_data);

****-****-****
//例2
var re = /(\w+)\s(\w+)/;
var str = "John Smith";
var newstr = str.replace(re, "$2, $1"); //$1にはJohn $2にはSmith

console.log(newstr);
Smith, John


String.replaceメソッドは、正規表現でマッチした文字列を置換することができる。

引数repには、「\$1 ~ \$9」といった特殊変数を使用することができる。これらは、サブマッチ文字列を保存するための変数であり、正規表現で()で囲った文字列が順番にセットされていきます。


6.splitメソッド


構文

str.split(sep [,limit]) //str:分割対象の文字列 sep:区切り文字(正規表現) limit:分割回数の上限

//例
var pattern = /[\/\.\-]/; // 「/」,「-」,「.」を区切って年月日に分割するコード。

console.log('2016/12/04'.split(pattern));
["2016", "12", "04"]
console.log('2016-12-04'.split(pattern));
["2016", "12", "04"]
console.log('2016.12.04'.split(pattern));
["2016", "12", "04"]


String.splitメソッドは、正規表現で文字列を分割することができる。


以上。

正規表現の勉強がてらにまとめてみました。

ご指摘等ありましたらお手数ですが、ご指導お願いします><。