JavaScriptの正規表現【プログラミング初心者向け教材】

プログラミングで複雑なルールによる入力チェックや、文字列置換を行いたい時に正規表現を使えると非常に便利です。

複雑な入力チェックの処理をいくつも記述すると分かりづらいコードで、不具合の原因となる場合もあります。

正規表現を用いるとシンプルな記述方法で、簡潔なロジックで表すことができます。

その一方で、正規表現自体の記述方法はルールがたくさんあり、すべてを覚えるのは困難です。

必要な時に調べれば良いので、すべてを覚える必要はないと思いますが、どんなことができるのかは知っておく必要があります。

そこで本記事では、JavaScriptの正規表現についての記述方法やできることについてまとめます。

プログラミング初心者の方の学習や、忘れてしまった方の復習として、参考にしていただければ幸いです。

記載しているプログラムは、Node.js14.14.0を使って動作確認をしています。

JavaScriptの正規表現

JavaScriptの正規表現として以下の内容を採り上げます。

正規表現の作成方法

JavaScriptで正規表現を作成するには、スラッシュによって囲まれた文字列で表現します。

regex = /abc/;

スラッシュで囲まれた文字列は、RegExpオブジェクトとして作成されます。

正規表現の2つ目のスラッシュの後に、オプションフラグを付けることができます。
よく使われるのは、g と i です。

regex = /abc/gi;

gオプションは文字列全体を対象として、正規表現に複数回該当する場合は、すべてを対象とします。
gオプションを指定しない場合は、最初の1回目の該当のみを対象とします。

iオプションは、大文字小文字を区別せずに判定します。
iオプションを指定しない場合は、大文字小文字を区別して判定します。

正規表現にはたくさんの特殊文字やオプションがありますが、詳細はMDN web docsをご参照ください。

正規表現による文字列チェック

正規表現による文字列チェックは、test、search、matchを使う方法があります。

RegExpオブジェクトのtestメソッドは、正規表現にマッチする場合はtrue、マッチしない場合はfalseを返します。

str = "Hello JavaScript!!";
regex = /javascript/gi;
console.log(regex.test(str)); // -> true

Stringオブジェクトのsearchメソッドは、正規表現に最初にマッチした場所のインデックスを返します。マッチしない場合は-1を返します。

str = "Hello JavaScript!!";
regex = /javascript/gi;
console.log(str.search(regex)); // -> 6

Stringオブジェクトのmatchメソッドは、マッチした文字列を配列で返します。マッチしない場合はnullを返します。

str = "Hello JavaScript!!";
regex = /javascript/gi;
console.log(str.match(regex)); // -> [ 'JavaScript' ]

正規表現による文字列置換

正規表現による文字列置換は、replaceを使います。

str = "Hello World!!";
rep = "JavaScript";
regex = /World/g;
console.log(str.replace(regex, rep)); // -> Hello JavaScript!!

replaceメソッドの第1引数に正規表現を指定し、第2引数に置換後の文字列を指定します。

正規表現にマッチする文字列を置換した文字列を戻り値として返します。

正規表現による文字列抽出

正規表現で指定した部分を文字列から抽出するには、抽出したいパターンに括弧を含めて指定します。

replaceメソッドで抽出した文字列を使って置換をする場合は、抽出した文字列を$1、$2を使って取得します。

str = "Hello JavaScript!!";
regex = /(\w+)\s(\w+)/;
rep = str.replace(regex, "$2 $1");
console.log(rep); // -> JavaScript Hello!!

matchメソッドで抽出した文字列を取得する場合は、取得した配列の1番目の要素が1つ目に抽出した文字列になります。

str = "Hello JavaScript!!";
regex = /(\w+)\s(\w+)/;
matches = str.match(regex);
console.log(matches[1]); // -> Hello
console.log(matches[2]); // -> JavaScript

正規表現のエスケープ

正規表現においてピリオドやプラス、アスタリスクなどの記号は、特殊文字として定義されている文字です。

これらを文字列に含んでいる場合の正規表現を作成する場合は、特殊文字として扱われないようにエスケープする必要があります。

エスケープは、特殊文字の直前にバックスラッシュを付けます。

str = "Hello+JavaScript.";
regex = /^\w+\+\w+\.$/;
console.log(regex.test(str)); // -> true

上記のプログラムでは、プラスとピリオドの直前にバックスラッシュを入れてエスケープした正規表現を作成しています。

正規表現はプログラム外でも役に立つ

正規表現はプログラムをシンプルにしてくれる便利なものですが、プログラム外でも役に立つことがあります。

エディタを使って文章を書いている際に、文字列の検索や置換をしたくなった場合に、正規表現で指定することが可能なエディタもあります。

Linuxのコマンドでも正規表現を使えるコマンドがたくさんあります。

Excelの関数などでも正規表現を使うことができます。

正規表現で書いてみたけど、思うようにマッチしないという場合には、正規表現チェッカーというツールで分かりやすく一致部分を表現してくれるツールもありますので活用してみてください。

正規表現は記述方法が難しいのですが、書けると非常に効率を上げてくれる手段になります。

サラッと正規表現を書ける人はカッコいいですよね。

今回はJavaScriptの正規表現についてまとめました。

以上、参考になれば幸いです。