Javascript での正規表現の記述方法についてまとめました。

【はじめに】 Javascript で「正規表現オブジェクト」を宣言する

Javascriptでは正規表現はオブジェクトの型の一つとして定義されています。これは、コンストラクタ関数「RegExp」で定義されています。

まずは試しに、RegExp オブジェクトを生成してみましょう。

正規表現オブジェクトの生成方法

Javascriptで正規表現オブジェクトの生成方法は２種類あります。

1. コンストラクタ関数 RegExp()を用いる
2. 「/（スラッシュ）」を使って正規表現を囲む「リテラル表現」を用いる

それぞれの具体例です：

// １）コンストラクタ関数を利用
var re = new RegExp('https?://example\.com');


// ２）リテラル表現を利用
var re = /https?:\/\/example\.com/;

（２）の表現のほうがややシンプルに見えますね。

ただ、２の場合、リテラル表現では、「/」以外はデリミタとして認められませんので注意して下さい。デリミタとしてのスラッシュを使っていますので、上記のように正規表現ではスラッシュをエスケープする必要が生じます。

逆に（１）では、デリミタが不要で、よって、スラッシュをエスケープする必要はありません。

どちらを使うべき？

実際どちらでも良いのですが、もし大きな違いがあるとすれば、Javascript においては、正規表現でURL文字列を扱う事も多いのではないでしょうか？そのような場合、RegExpコンストラクタ関数を使えば、URLに頻出するスラッシュをエスケープしなくて済みますので、正規表現パターンを読みやすく記述できるでしょう。もしスラッシュを含まない正規表現であれば、リテラル表現を使ったほうがシンプルに記述できるのは言うまでもありません。もちろん、最終的にはお好みです。

正規表現の文字列内にスラッシュがあるときだけ、new RegExp() を使おうかな〜。

Javascript の正規表現マッチングできる関数

さて、正規表現オブジェクトを生成したら、次は、実際のマッチング処理の方法です。

Javascript の代表的な正規表現を使ったマッチング方法は、（A）RegExpクラスのメソッドを利用するか、もしくは、（B）Stringクラスの関数に引数としてRegex オブジェクトを渡す方法もあります。

それぞれよく似た機能を提供しますので、お好みの関数を使って下さい。

A正規表現オブジェクトの関数

BString オブジェクトの関数

Javascript における正規表現のマッチング例

それでは、マッチングの処理を、目的別に見ていきます

Case 1正規表現でマッチした文字列を取得したい

マッチングを成否を確認するには、RegExpオブジェクトの.exec()メソッドか、Stringオブジェクトの.match()を使います。

RegExp.exec()

正規表現オブジェクトの関数、exec() は幾分詳しい情報を配列で返します。また、オブジェクトの状態を更新します。

var pattern = /(ja)va/;

// 結果情報の配列を返す。見つからなければnull
var result = pattern.exec('javascript');

// 最後のマッチング文字列。見つからなければNULL。
console.log ( result[0] ); // java

// 括弧で囲まれたサブパターンのマッチング（1, 2, 3.. の上限なし）
console.log ( result[1] ); // ja

// input文字列
console.log ( result['input'] ); // javascript

String.match()

文字列オブジェクトの関数、.test() メソッドはもう少しシンプルです。サブパターンのマッチングも参照できません。

var subject = 'javascript';

// 結果情報の配列を返す。見つからなければnull
var result = subject.match('/java/');　

console.log(result); // java

目的に応じて使い分けられるでしょう。

Case 2正規表現へのマッチが見つかるかどうかチェックして、真偽を知りたい。

単にマッチするかどうかを知りたい時は、RegExpの.test() メソッドか。Stringの.search() が利用できます。

RegExp.test()

RegExpの.test() を使うと・・・、

var pattern = /(ja)va/;

// true/false を返す。
var result = pattern.test('javascript');

console.log(result);  // true

String.search()

Stringの.search() を使うと・・・、返り値の種類が少し異なります。

var subject = 'javascript';

// マッチングの位置を整数で返す。見つからない時は-1
var result = subject.search('/java/');
console.log(result); // 0

それぞれ、似てるけど動作が異なり少し紛らわしいですね。

Case 3マッチ文字列を置換したい

マッチングを置換するには、Stringのreplaceを使います。戻り値として新しい文字列オブジェクトが返されます。（もとの文字列は変更されません）

String.replace()

var subject = 'Javascript is flexible.';

// 単純な置換。iは大文字小文字を無視するオプション。
var result = subject.replace('/java/i', 'Action' ); 
console.log(result); // Actionscript is flexible.


// カッコ内のサブパターンを後方参照
var result = subject.replace('/(Java).*(easy)/', '$1 is not so $2.' );
console.log(result); // Java is not so flexible.

// グローバルな置換。最初の置換で処理が止まらず、何度でも置換する
var result = subject.replace('/o/g', 'O' );
console.log(result); // Java is nOt sO flexible.

RegExpを使って置換もできますが、上記 String 関数は幾分シンプルに記載できるでしょう。

var num = 1;               // Integer型のリテラル表現
var str = 'javascript';    // String型のリテラル表現
var str = [1, 2, 3];       // Array型のリテラル表現
var re = /javascript/;     // RegExp型のリテラル表現

参考リンク

基本的な正規表現に関しては、こちらもご一読下さい。

• 正規表現とは？概要と基本構文

また、正規表現のメタ文字に関しては、こちらにまとめています。

• 正規表現：メタ文字（特殊文字）の一覧

MDNのドキュメントです。詳しく記載されています。

• MDN：正規表現