JavaScript 正規表現

今回は正規表現をやります。

検索

				
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScriptのテストページ</title>
</head>
<body>
正規表現テスト
</body>
<script type="text/javascript">

	console.log("指定文字を抜き出します");
	console.log("abcde".match(/bc/));
	console.log(/bc/.exec("abcde"));
	// ↑両方とも["bc", index: 1, input: "abcde"]が出力されます

	console.log("指定文字が含まれるか判断します");
	var moto = "abcde";
	var search = "bc";
	var reg = new RegExp(search);
	console.log(reg.test(moto));
	console.log(/bc/.test(moto));
	// ↑両方ともtrueが出力されます

	console.log("実行オプションにiを付けると大文字、小文字を区別しません");
	search = "BC";
	reg = new RegExp(search,"i");
	console.log(reg.test(moto));
	console.log(/BC/i.test(moto));
	// ↑両方ともtrueが出力されます

	console.log("実行オプションにgを付けるとすべて抜き出します");
	moto = "abcdeabcde";
	search = "bc";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/bc/g));
	// ↑両方とも["bc", "bc"]が出力されます

	console.log("正規表現に^を付けると指定した文字が行の先頭にあるか調べます");
	console.log("(オプションにmを付けると文中の改行も検知します)");
	moto = "abcde\r\nabcde";
	search = "^ab";
	reg = new RegExp(search,"mg");
	console.log(moto.match(reg));
	console.log(moto.match(/^ab/mg));
	// ↑両方とも["ab","ab"]が出力されます


	console.log("正規表現に$を付けると指定した文字が行の後尾にあるか調べます");
	console.log("(オプションにmを付けると文中の改行も検知します)");
	moto = "abcde\r\nabcde";
	search = "de$";
	reg = new RegExp(search,"mg");
	console.log(moto.match(reg));
	console.log(moto.match(/de$/mg));
	// ↑両方とも["de","de"]が出力されます

	console.log("正規表現で*を指定すると直前文字の0回以上の繰り返しを抜き出します");
	moto = "abcaabbccaaabbbccc";
	search = "aa*";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/aa*/g));
	// ↑両方とも["a", "aa", "aaa"]が出力されます

	console.log("正規表現で?を指定すると直前文字の0または1回の繰り返すを抜き出します");
	moto = "abcaabbccaaabbbccc";
	search = "aaa?";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/aaa?/g));
	// ↑両方とも["aa", "aaa"]が出力されます

	console.log("正規表現で+を指定すると直前文字の1回以上の繰り返しを抜き出します");
	moto = "abcaabbccaaabbbccc";
	search = "a+";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/a+/g));
	// ↑両方とも["a", "aa", "aaa"]が出力されます

	console.log("正規表現で.を指定するとなにか一文字の代わりになります");
	moto = "abcaabbccaaabbbccc";
	search = "a..";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/a../g));
	// ↑両方とも["abc", "aab", "aaa"]が出力されます

	console.log("正規表現で.+?のように+?の組み合わせをすると一番短い検索結果が抜き出されます");
	moto = "abcaabbccaaabbbccc";
	search = ".+?c";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/.+?c/g));
	// ↑両方とも["abc", "aabbc", "caaabbbc", "cc"]が出力されます

	console.log("正規表現で[]で囲むと[]内のどれかが一致で抜き出されます。[0-9a-zA-Z]のように何から何のような指定も出来ます");
	moto = "abcaabbccaaabbbccc";
	search = "[ab]+";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/[ab]+/g));
	// ↑両方とも["abc", "aabbc", "caaabbbc", "cc"]が出力されます

	console.log("正規表現で[]で^を付けるとすべて不一致で抜き出されます");
	moto = "abcaabbccaaabbbccc";
	search = "[^ab]+";
	reg = new RegExp(search,"g");
	console.log(moto.match(reg));
	console.log(moto.match(/[^ab]+/g));
	// ↑両方とも["c", "cc", "ccc"]が出力されます

	console.log("正規表現で()で囲むと()内を個別で抜き出すことができます。");
	console.log("これを行う場合、実行オプションのgを外す必要があります。");
	moto = "abcaabbccaaabbbccc";
	search = "(ab+).+?(bc+)";
	reg = new RegExp(search);
	console.log(moto.match(reg));
	console.log(moto.match(/(ab+).+?(bc+)/));
	// ↑両方とも["abcaabbcc", "ab", "bcc"]が出力されます

</script>
</html>

正規表現は /～/で定義したり、new RegExp(～)で定義します。使い方は上記のサンプルのように書きます。

文字	説明
\s	スペース
\S	スペース以外
\d	数値([0-9])
\D	↑以外([^0-9])
\t	タブ文字
\w	英数字とアンダーバー([0-9a-zA-Z_])
\W	↑以外([^0-9a-zA-Z_])
\n	改行文字(CR)
\r	改行文字(LF)

記号を検索したい場合、正規表現で決められている記号とかぶる場合があります。記号の頭に\を付けると正規表現の記号として使われません。
例：\.、\\、\+ など

(カッコ)内のデータ取得

(カッコ)内で指定したデータを取得するサンプルです。matchメソッドは検索結果を配列で戻すので、その配列から指定データを取得します。
配列の0番目にはマッチした全体がセットされ、1番目からカッコに一致するデータがセットされます。

				
<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>JavaScriptのテストページ</title>
</head>

<body>
	正規表現テスト
	<div id="id1">Hello</div>
</body>
<script type="text/javascript">
	var moto = "abcaabbccaaabbbccc";
	var search = "(ab+).+?(bc+)";
	var reg = new RegExp(search);
	var ary = moto.match(/(ab+).+?(bc+)/);
	var ary2 = moto.match(reg);
	var html = "";
	html += "<table>";
	// aryをary2に変更しても同じ結果になります
	for (var idx in ary) {
		html += "<tr><td>" + idx + "</td><td>" + ary[idx] + "</td></tr>";
	}
	html += "</table>";
	document.getElementById("id1").innerHTML = html;
</script>

</html>

置換

				
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScriptのテストページ</title>
</head>
<body>
正規表現テスト
</body>
<script type="text/javascript">

	console.log("置換を行う場合、replace関数で正規表現を指定できます。");
	var moto = "abc123";
	var search = "b.";
	var reg = new RegExp(search,"g");
	console.log(moto.replace(reg,"A"));
	console.log(moto.replace(/b./g,"A"));
	// ↑両方とも["aA123"]が出力されます

	console.log("()を使うと抜き出すことができ、置換後の文字列に$+番号指定で含めることができます");
	moto = "abcde12345";
	search = ".*?(b.).*?([1-5]+)";
	reg = new RegExp(search,"g");
	console.log(moto.replace(reg,"--$1--$2--"));
	console.log(moto.replace(/.*?(b.).*?([1-5]+)/g,"--$1--$2--"));
	// ↑両方とも["--bc--12345--"]が出力されます

</script>
</html>

replace関数で置換元を正規表現で指定することができます。

置換元に()を指定すると、指定文字を抜き出すことができ、置換後の文字列に$番号指定で含めるとが出来ます。

ページのトップへ戻る