JavaScriptの正規表現を使用するメソッドまとめ

正規表現は一見複雑に見えます。苦手意識を持っている方も多いのではないでしょうか。この記事では、正規表現とはから、JavaScriptでの正規表現の使い方まで解説します。正規表現を使いこなし、複雑な文字列処理をシンプルなプログラムで記述できるようになりましょう！

正規表現とは

正規表現とは、文字列のパターンを表現する記述方法です。

プログラミングを行う上で正規表現を使いこなすことで、文字列処理を簡潔に記述することができ、読みやすくメンテナンス性の高いプログラムを作成することができます。

例えば、JavaScriptではユーザが入力した文字列を検証する場合によく使用します。それ以外にも、あるファイルから特定のパターンの文字列を見つける時に使用します。

正規表現を使用せずに文字列処理を行う場合は、対象の文字列をループで１文字ずつに分割し、複雑な条件分岐を書くことになります。しかし、正規表現を用いるとこれらの処理をたった数行で記述することができます。

シンプルなプログラムはメンテナンス性も上がります。また正規表現を用いる方が素早く実装することができます。一見複雑に見える正規表現ですが、使いこなすことによる利点は非常に大きいです。

JavaScriptでの正規表現の作成方法とメソッドのまとめ

JavaScriptでの正規表現の作成方法

JavaScriptでの正規表現の作成は、正規表現オブジェクトを使用します。

JavaScriptで正規表現オブジェクトを使用するには、「正規表現リテラルを使用する方法」と「RegExpオブジェクトのコンストラクタを呼び出す方法」の2種類があります。

正規表現リテラルを使用する方法

JavaScriptでは正規表現リテラルが用意されています。
JavaScriptの正規表現リテラルは以下のように記述します。

const pattern = /abc+d/;

このコードは、「abc+d」という正規表現のパターン文字列を定数patternに代入しています。JavaScriptでは、スラッシュ（/）で正規表現のパターン文字列を囲むことで、正規表現リテラルとして扱います。

RegExpオブジェクトのコンストラクタを呼び出す方法

JavaScriptでは、RegExpオブジェクトのコンストラクタを呼び出すことで正規表現オブジェクトを生成することもできます。以下のように記述することでRegExpオブジェクトのコンストラクタを呼び出し、正規表現オブジェクトを生成します。

const pattern = new RegExp('adc+d');

このコードでは、「abc+d」という正規表現のパターン文字列で正規表現オブジェクトを生成し、そのオブジェクトをpatternに代入しています。

この方法では、文字列から正規表現オブジェクトを動的に生成することができます。例えば、ユーザから入力された文字列を元に正規表現オブジェクトを生成したい場合に使用します。

正規表現パターンの記述

正規表現パターンは、文字と特殊文字の組み合わせで表します。これはJavaScriptに限らず、他の言語でも同様です。

文字は、通常のアルファベットや数字のような文字のことです。特殊文字とは、正規表現において特別な意味を持つ文字のことです。例えば、「$」や「*」、「+」といった文字があります。特殊文字は後ほど詳しく解説します。

単純な正規表現パターンの例

単純な正規表現パターンは、通常の文字のみで表されるパターンです。
例えば、JavaScriptで以下のような正規表現パターンを作成します。

const pattern = /book/;

このコードは、「book」という正規表現パターンを定数patternに代入しています。この場合、検索対象文字列の中に存在する「book」という文字列にマッチします。

例えば、「bookabcde」という文字列や、「This is a book.」という文字列にはマッチします。それに対して、「vwxyz」や、「This is a pen.」のような文字列にはマッチしません。

特殊文字を使用した正規表現パターン

特殊文字を使用した正規表現パターンは、通常の文字と特殊文字を用いた正規表現パターンです。
単純な正規表現パターンに比べて、幅広い表現ができます。例えば、JavaScriptで以下のような正規表現パターンを作成します。

const pattern = /a+/;

このコードは、「a+」という正規表現パターンを定数patternに代入しています。「+」は特殊文字で、「直前の文字を１文字以上繰り返し」という意味です。つまり、この正規表現パターンは、「aa」や「aaaabcd」のような文字列にマッチします。

正規表現における特殊文字のまとめ

特殊文字を使用することでより複雑な正規表現パターンを表現することができます。
以下の表で代表的な特殊文字を解説します。

特殊文字	意味
\	特殊文字として使われる記号（$や*など）を通常の文字として扱う場合に使用します。例えば、\$や\*のように使用します。
^	入力の先頭を表す。
$	入力の末尾を表す。
*	直前の文字の0回以上の繰り返しを表す。
+	直前の文字の1回以上の繰り返しを表す。
?	直前の文字の0回か1回の繰り返しを表す。
.	改行文字以外の任意の1文字を表す。
(x)	xにマッチし、マッチしたものを記憶する。
(?:x)	xにマッチするが、マッチしたものは記憶しない。
x(?=y)	xにyが続くことを表す。
x(?!y)	xにyが続かないことを表す。
x|y	xまたはyであることを表す。
{n}	直前の文字がn回出現することを表す。
{n,}	直前の文字がn回以上出現することを表す。
{n,m}	直前の文字がn回〜m回出現することを表す。
xyz	xyzのどれにでもマッチする。
^xyz	xyz以外の文字にマッチする。
\b	スペースや改行文字のような単語の区切りを表す。
\B	単語区切り以外の文字を表す。

括弧の使い方(キャプチャ)

括弧()を正規表現パターンに使用すると、マッチした文字を記憶することが出来ます。
例えば、以下のJavaScriptのコードを考えてみます。

const pattern = /a(b)c/;
let str = 'abcdefg';
let newStr = str.replace(pattern, '$1');

この場合は、newStrには’b’が代入されます。
括弧を使用して記憶された文字は、$1で表されます。括弧が複数ある場合は順番に、$1、$2、$3……で表します。

JavaScriptで正規表現を使用するメソッドまとめ

JavaScriptではexecメソッド、testメソッド、matchメソッド、searchメソッド、replaceメソッド、spliteメソッドで正規表現を使用します。
それぞれのメソッドについて詳しく解説します。

execメソッド

execメソッドの構文

execメソッドは、指定した文字列の中で一致するものを探すRegExpのメソッドです。

引数は、正規表現に一致するかどうか探す対象の文字列を指定します。戻り値は、一致した文字列の配列またはnullを返します。

execメソッドの使用例

execメソッドは、以下のように使用します。

const pttern = new RegExp('abc');
const str = 'abcdefg';
const result = pattern.exec(str);
console.log(result[0]);

このコードは、まず1行目で「abc」というパターンの正規表現オブジェクト生成、patternに代入します。次に、2行目で定数strに「abcdefg」という文字列代入します。

そして3行目でpatternのexecメソッドを呼び出し、戻り値をresultに代入します。最後に4行目でresultの値を表示します。ここでは「abc」と表示されます。

testメソッド

testメソッドの構文

testメソッドは、指定した文字列中に一致するものがあるかをテストするRegExpのメソッドです。
引数は、正規表現に一致するかものがあるかをテストする対象の文字列です。戻り値は、正規表現に一致するものがある場合はtrue、ない場合はfalseを返します。

testメソッドの使用例

testメソッドは以下のように使用します。

const pttern = new RegExp('hello');
const str = 'hello world';
const result = pattern.test(str);
console.log(result);

このコードは、まず1行目で「hello」というパターンの正規表現オブジェクト生成します。次に、2行目で定数strに「hello world」という文字列代入します。

そして、3行目でtestメソッドを呼び出し、戻り値をresultに代入します。最後に、4行目でresultの値を表示します。ここでは「true」と表示されます。

matchメソッド

matchメソッドの構文

matchメソッドは、ある文字列中に一致するものを検索するStringメソッドです。RegExpオブジェクトのexecメソッドに似ています。

引数は、検索する正規表現オブジェクトRegExpです。戻り値は、正規表現に一致する文字列がある場合は、その文字列格納された配列を返します。一致しない場合はnullを返します。

matchメソッドの使用例

matchメソッドは以下のように使用します。

const pttern = new RegExp('Section .');
const str = 'Section 1: start programming';
const result = str.match(pattern);
console.log(result[0]);

このコードは、まず1行目で「Section .」というパターンの正規表現オブジェクト生成します。次に、2行目で定数strに「Section 1: start programming」という文字列代入します。

そして、3行目でmatchメソッドを呼び出し、戻り値をresultに代入します。最後に4行目でresultの値を表示します。ここでは「Section 1」と表示されます。

searchメソッド

searchメソッドの構文

searchメソッドは、ある文字列中に指定した正規表現パターンに一致するものがあるかをテストするStringメソッドです。

RegExpオブジェクトのtestメソッドに似ています。引数は、テストする正規表現オブジェクトRegExpです。戻り値は、正規表現パターンと文字列が最初に一致した部分のインデックスを返します。一致しない場合は-1を返します。

searchメソッドの使用例

searchメソッドは以下のように使用します。

const pttern = new RegExp('w+');
const str = 'www.test-site.com';
const result = str.search(pattern);
console.log(result);

このコードは、まず1行目で「w+」というパターンの正規表現オブジェクト生成します。次に、2行目で定数strに「www.test-site.com」という文字列代入します。そして、3行目で定数strのsearchメソッドを呼び出し、戻り値をresultに代入します。

最後に、4行目でresultの値を表示します。ここではstr[0]からstr[2]までの「www」が正規表現パターンと一致するので「0」と表示されます。

replaceメソッド

replaceメソッドの構文

replaceメソッドは、ある文字列中で指定した正規表現パターンに一致する部分を検索し、指定した文字列に置き換えるStringメソッドです。

引数は、検索する正規表現オブジェクトRegExpと置き換え後の新しい文字列です。戻り値は、正規表現パターンで一致する部分を置き換えた後の新しい文字列です。

replaceメソッドの使用例

replaceメソッドは以下のように使用します。

const pttern = new RegExp('\.com');
const str = 'taro@abcmail.com';
const result = str.replace(pattern, '.jp');
console.log(result);

このコードは、まず1行目で「\.com」というパターンの正規表現オブジェクト生成します。次に、2行目で定数strに「taro@abcmail.com」という文字列代入します。

そして、3行目で定数strのreplaceメソッドを呼び出し、戻り値をresultに代入します。最後に、4行目でresultの値を表示します。

ここでは「.com」を「.jp」に置き換えた後の文字列「taro@abcmail.jp」が表示されます。

splitメソッド

splitメソッドの構文

splitメソッドは、ある文字列を指定した正規表現パターンに一致する部分を区切り文字として分割するStringメソッドです。

引数は、区切り文字であり、正規表現オブジェクトを使用することができます。戻り値は、分割した文字列を持つ配列です。

splitメソッドの使用例

splitメソッドは以下のように使用します。

const pttern = new RegExp('\b|\.');
const str = 'Hello, this is Taro.';
const result = str.replace(pattern);
console.log(result);

このコードは、まず1行目で「\b|\.」というパターンの正規表現オブジェクト生成します。次に、2行目で定数strに「Hello, this is Taro.」という文字列代入します。

そして、3行目で定数strのsplitメソッドを呼び出し、戻り値をresultに代入します。最後に、4行目でresultの値を表示します。

ここでは定数strをスペースとピリオドで分割した配列「[“Hello,”, “this”, “is”, “Taro”]」が表示されます。

正規表現を使いこなしてシンプルなプログラムを書こう

この記事では正規表現の基本的な説明から、JavaScriptでの正規表現の扱い方を解説しました。正規表現はJavaScriptだけでなく、他の言語やツールでも使用されます。また、JavaScritpでは正規表現は、ユーザからの入力を検証する際によく使用されます。

正規表現を使いこなすことで、複雑な文字列処理をシンプルなプログラムで行うことができます。正規表現は一見複雑に見えますが、使いこなすことができれば強力な武器になります。正規表現を使いこなしてシンプルなプログラムを書きましょう。