JavaScript プログラミング

【JavaScript】正規表現の使い方【基本編】

JavaScriptで正規表現を扱う方法について解説します。
この記事では正規表現でよく見られる*^$などの使い方について解説は行わず、正規表現の構文について解説します。
正規表現は覚える内容が多いため一度に学習しようとするのは大変なので、まずは基本をしっかり押さえましょう!

*^$の使い方については別途、応用編の記事で解説予定です。

正規表現とは

正規表現とは、文字の組み合わせを照合するために用いられるパターンです。
以下は入力した文字列に半角小文字のaが含まれるかを判定するサンプルです。

See the Pen regular expression 1 by Usagi (@naniwa_usagi) on CodePen.

正規表現の定義方法

正規表現の定義方法は2通りあります。
リテラルで書く方が簡潔なので、よく使われます。

正規表現リテラル

正規パターンをスラッシュ/で囲うように定義します。

JavaScript
// /正規パターン/
var pattarn = /a/;

オプションをつけたい場合は以下のように正規パターンのうしろに記述します。

JavaScript
// /正規パターン/オプション
var pattarn = /a/g;
RegExpオブジェクトのコンストラクター関数を呼び出す

引数に正規パターンを設定します。

JavaScript
var pattarn = new RegExp('a');

オプションをつけたい場合は以下のように第二引数を追加します。

JavaScript
// new RegExp('正規パターン', 'オプション')
var pattarn = new RegExp('a', 'g');

JavaScriptの正規表現の使い方

JavaScriptではメソッドを呼び出して正規表現を行います。

1.execメソッド

execメソッドはRegExpオブジェクトのメソッドで、正規パターンに一致するかを検索し、一致する文字列を配列で返します。

また、一致するものがない場合はnullが返されます。

JavaScript
// 正規パターン.exec(検索文字列)
var result = pattern.exec('abc');
2.matchメソッド

matchメソッドはStringオブジェクトのメソッドです。

execメソッドと使い方はほとんど同じで、一致する文字列を配列で返し、一致するものがない場合にnullが返されます。

execメソッドとは正規パターンおよび検索文字列の順序が異なる点に注意してください。

JavaScript
// 検索文字列.match(正規パターン)
var result = 'abc'.match(pattern);

execメソッドとmatchメソッドにはもう一点、グローバルサーチを行った時の返却値が異なります。

グローバルサーチを行わない場合はどちらも返却値が同じになります。

JavaScript
// グローバルサーチを行わない場合
var pattern1 = /a/;
var result1 = pattern1.exec('abc');
// -> ['a', index: 0, input: 'abc', groups: undefined]
var result2 = 'abc'.match(pattern1);
// -> ['a', index: 0, input: 'abc', groups: undefined]

// グローバルサーチを行う場合
var pattern2 = /a/g;
var result1 = pattern2.exec('abc');
// -> ['a', index: 0, input: 'abc', groups: undefined]
var result2 = 'abc'.match(pattern2);
// -> ['a']
3.testメソッド

testメソッドはRegExpオブジェクトのメソッドで、正規パターンの検索結果をtrue/falseで返します。

正規パターンおよび検索文字列の順序はexecメソッドと同じです。

正規パターンのチェックだけを行いたい場合はtestメソッドを使うといいでしょう。

JavaScript
// 正規パターン.test(検索文字列)
var result = pattern.test('abc');
4.searchメソッド

searchメソッドはStringオブジェクトのメソッドで、正規パターンに一致する文字列位置を返します。

一致するものがない場合は-1を返します。

正規パターンおよび検索文字列の順序は同じStringオブジェクトのメソッドであるmarchメソッドと一緒です。

JavaScript
// 検索文字列.search(正規パターン)
var result = 'abc'.search(pattern);
5.replaceメソッド

replaceメソッドはStringオブジェクトのメソッドで、正規パターンに一致する文字列を別の文字列に置き換えます。

入力された文字列を一律で全角にしたり、大文字にしたい場合に使用されます。

JavaScript
// 検索文字列.replace(正規パターン, 置き換えたい文字列)
var result = 'abc'.replace(pattern, 'A');
6.splitメソッド

splitメソッドはStringオブジェクトのメソッドで、正規パターンで文字列を分割することができます。

郵便番号や電話番号のハイフン-を除去する場合などに使用されます。

JavaScript
// 検索文字列.split(正規パターン)
var result = 'abc'.split(pattern);

実装例

ここまで解説した内容をもとに簡単な正規表現の実装例を紹介します。

「正規パターンを定義して、検索文字列に対してメソッドを使用する」というのが基本構文になります。

JavaScript
var val = 'abc';

// 正規パターンを定義(半角小文字のaが文字列に含まれるかの正規パターン)
var pattern = /a/;

// 正規パターンに一致するかを検索
// testメソッドを使用
var result1 = pattern.test(val);
console.log('result1 ->', result1);
// -> true

// matchメソッドを使用
var result2 = val.match(pattern);
console.log('result2 ->', result2);
// -> ['a', index: 0, input: 'abc', groups: undefined]

// replaceメソッドを使用
var result3 = val.replace(pattern, 'A');
console.log('result3 ->', result3);
// -> Abc

今回紹介した内容はほんの一例で、他にもさまざまな正規パターンの指定方法が存在します。

オプションを用いた実装例などは別途応用編の記事で解説予定です。

今回は以上です。

  • この記事を書いた人

Usagi

▶︎ 新米エンジニア ▶︎ Usagi Blog 運営 ▶︎ 関西在住 ● 主にプログラミングについての学びを発信中

-JavaScript, プログラミング