「正規表現」とは――すぐに使う方法と「ECMAScript」のバージョン：ECMAScriptで学ぶ正規表現（1）

正規表現の基本と、ECMAScript（JavaScript）における利用方法を紹介する連載。初回は、ECMAScriptのバージョンと正規表現の機能対応、ブラウザでのサポート状況、正規表現を扱う方法（オブジェクト、メソッド）について。

[山内直（著）／山田祥寛（監修），WINGSプロジェクト]

連載：ECMAScriptで学ぶ正規表現

　本連載のサンプルコードをGitHubで公開しています。こちらからダウンロードしてみてください。具体的な利用方法は連載第1回を参考にしてください。

正規表現とは

　そもそも「正規表現」とは何でしょうか？　それを理解するために、コマンドプロンプトや「Microsoft Word」などにおけるワイルドカードを見直します。

ワイルドカードとは何か？

　「ワイルドカード」とは、もともとトランプなどのカードゲームにおける「万能カード」を意味しています。転じて、検索などのグロブパターンに使用される文字をワイルドカードといいます。Windowsのコマンドプロンプトでファイル名を指定するときのアスタリスク（*）とクエスチョン（?）が代表的なワイルドカードで、それぞれ「任意の文字列」「任意の1文字」を意味します。

　「*.txt」「?.txt」のように指定すると、それぞれ「<任意の文字列>.txt」「<任意の1文字>.txt」に一致するファイル名を指定できます。ワイルドカードを使うことで、複数のファイル名に共通するパターンを指定することができ、ファイルの検索などが便利になるわけです。

　Wordでは、検索のダイアログボックスで［オプション］を展開し、［あいまい検索（日）］をオフにして、［ワイルドカードを使用する］にチェックを入れることで、ワイルドカードによる検索が可能になります。同じダイアログボックスで［特殊文字］をクリックすると、ワイルドカードに相当する特殊な文字を検索ボックスに入力できます。上記の「*」「?」に相当する「任意の1文字」「0以上の文字」に加えて、文字の範囲や繰り返し回数が指定できるなど、グロブより細かな指定ができるようになっています。単純な文字列による検索にとどまらず、一定のパターンの文字列を検索することができ、文書作成の効率をアップさせます。

Wordのワイルドカード指定画面

正規表現とワイルドカードの違い

　正規表現とは、このワイルドカードをより複雑なパターンに適用できるように高度化したものです。上記のコマンドプロンプトやWordの検索機能を使っていて、「こんな指定ができたらいいのに！」と思ったことはないでしょうか？　そのようなときに正規表現が活用できれば、さらに便利に効率良く作業ができるようになるに違いありません。

　正規表現の歴史は古く、1950年代には最初のモデルが存在していました。そして、UNIX系のツール（「ed」など）に取り入れられ、一気に広まりました。edはテキストエディタの一つで、正規表現による検索や置換を可能にしています。さらに「grep」「vi」などのツールにも取り入れられ、UNIXにおけるパターン検索の地位を定着させます。ツールに加えて「AWK」「Perl」などのプログラミング言語も正規表現をサポートするようになり、今ではほとんどのプログラミング言語が正規表現をサポートします。

　このように、正規表現はツールやプログラミング言語に次々と取り入れられてきましたが、実装がツールやプログラミング言語によって異なるという問題も発生しました。しかし現在では、「POSIX」（Portable Operating System Interface）というIEEE（Institute of Electrical and Electronics Engineers）が定めた規格で標準化されており、ほとんどの部分を共通に扱えるので、正規表現のポータビリティは非常に高いものになっています。

　既述の通り、正規表現は決して新しい技術ではありません。しかし、業務の効率化と自動化による生産性の向上、ビジネスにおけるコンピュテーショナルシンキング（計算機的思考）の必要性が話題になる今、正規表現を学ぶことには意義があることでしょう。WordのワイルドカードはWordでしか使えませんが、標準化された正規表現なら、あらゆる場所で活用の機会があるわけです。一度基本を覚えてしまえば、UNIXやLinuxのツール、各種のエディタ、プログラミング言語など、場所を選ばず活用できます。

　本連載「ECMAScriptで学ぶ正規表現」ではECMAScriptにおける正規表現を紹介します。正規表現はさまざまな言語で利用できますが、ECMAScriptは特別な準備なくWebブラウザだけで利用できます。「ECMAScript 2018」では正規表現のサポートも大幅に強化されました。後述のようにECMAScriptも標準化されており、クライアントサイドにとどまらずサーバサイドでも活躍の場を広げていることから、正規表現を学び実践する場としてはこれ以上のものはないと考えられます。

ECMAScriptのバージョンと正規表現

　「ECMAScript」は、Ecma Internationalの下で標準化されているJavaScriptの規格です。「エクマスクリプト」といいます。Ecma（エクマ）とは「European Computer Manufacturers Association」の略で、日本語では欧州電子計算機工業会のことです。1961年に設立し、情報通信技術に関する規格を統一、標準化する機関であり、またその規格も意味します。ECMAScriptは、「ECMA-262」という規格で定められており、ISO/IEC JTC 1では「ISO/IEC 16262」として、日本でも「JIS X 3060:2000」として、規格を定めています。

　ECMAScriptでは、バージョンを「エディション」（版）で管理します。初版の発行は1997年6月で、大きく変化したのはエディション6のときです。エディション5までは、エディション番号そのものを「ECMAScript Edition 5th」のように用いていましたが、Edition 6からは発行年を用いた「ECMAScript 2015」のように、毎年改訂されるようになりました。これをさらに略して「ES2015」といった表記がWeb開発の世界では一般的に用いられています。2021年12月の原稿執筆時点での最新版は「ECMAScript 2021（Edition 12）（ES2021）」です。

　ECMAScriptでは、改訂によって正規表現にまつわる機能が追加、改良されています。それらをざっくりまとめると表1の通りです（ES2015以降）。これらについては、本連載を通じて紹介する予定です。

エディション	内容
2015	Unicodeサポートの拡充。U+10000以上の文字が正しく扱えるようになった yフラグにより指定位置からのマッチングが可能になった well-knownシンボルによるカスタマイズが可能になった
2018	sフラグによる改行文字のマッチングを制御可能になった 名前付きキャプチャーグループが使用可能になった 先読みに加えて後読み機能もサポートされた Unicodeプロパティの利用が可能になった
2022	dフラグによるマッチング結果からのインデックス範囲の取り出しが可能になった
表1　ECMAScriptにおける正規表現サポート

ECMAScriptとJavaScript

　上記で「ECMAScriptは、JavaScriptの標準規格」と書きました。とすると、ECMAScriptとJavaScriptという区別があるのはなぜなのでしょうか？　JavaScriptは、ECMAScriptのWebブラウザにおける実装を指します。Webブラウザで使用できるECMAScriptがJavaScriptなのです。

　JavaScriptの他にもECMAScriptの実装があります。例えば、「Internet Explorer」ではIE8まで「JScript」と呼んでいて、「Adobe Flash」では「ActionScript」と呼んでいました。つまり、ECMAScriptという標準があり、そしてWebブラウザなどのアプリケーションごとにJavaScriptやActionScriptといった実装があるのです。仕様と実装、と考えれば分かりやすいと思います。

　Webブラウザに限ってしまえば、「そこで動作するJavaScriptは、どのECMAScriptのエディションをサポートするのか」が重要になります。ただ、代表的なモダンブラウザ（「Google Chrome」「Apple Safari」「Mozilla Firefox」「Microsoft Edge」）の最新版では、ECMAScript 2021のサポートを完了したので、あえて古いWebブラウザを利用しなければならない場合以外は、特に意識する必要はないでしょう。

Webブラウザで使う方法

　ECMAScriptによる正規表現を実践するには、Webブラウザ上の実装であるJavaScriptを利用するのが最も簡便です。特に、本稿の後半で紹介するJavaScriptのメソッドのサンプルのようなものなら、Webブラウザの開発者ツール（ブラウザによって名称は異なる）を使ってすぐに試せます。Chrome（DevTools）の場合、空のタブを開いた状態で、ウィンドウ右上の3点メニューをクリックし、「その他のツール」→「デベロッパー ツール」と選択することで、DevToolsがアクティブになります。

Chromeでデベロッパー ツールを呼び出す

Chromeのデベロッパー ツール

　ここでは、「DevTools is now available in Japanese!」と表示されています。これは、「日本語になります」というサジェスチョンなので、「日本語にしたい」という読者は「Switch DevTools to Japanese」ボタンをクリックしてください。「Always match Chrome's language」ボタンをクリックすると、Chromeの言語設定に合わせることができます。「Don't show again」ボタンをクリックすると、このサジェスチョンが出なくなるので、その後に言語を変更したい場合には設定ボタン（歯車のアイコン）から変更してください。

　ここでは、Chromeの言語設定に合わせました。そして、上部のタブから「コンソール」をクリックして切り替えます。これで準備が整いました。

日本語になったデベロッパー ツール

　JavaScriptからWebブラウザの画面に何かを書き出すには「document.write()」メソッドなどを用いますが、コンソールで実行するときには「console.log()」メソッドを用います。以下の例では、コンソールに「Hello, World!!」というおなじみのメッセージを表示します。

console.log('Hello, World!!');

　下図のように、コンソール上のプロンプトに入力し、「Enter」キーを押すと実行結果が表示されます。「undefined」と表示されるのは、プログラムの実行結果が有効な値として評価されなかったからなので、ここでは無視して構いません。

コンソール上でプログラムを実行

正規表現を専門に扱うRegExpクラス

　ECMAScriptで正規表現を扱うには、専用の「RegExp」クラスとそのメソッド、「String」クラスに用意された一部のメソッドを使用します。正規表現主体のRegExpクラスと、文字列主体のStringクラスというように使い分けます。まずはRegExpクラスを紹介します。

RegExpクラスの使い方