導入：なぜRegExpリテラルを知るべきか
JavaScriptで文字列のパターンマッチングや置換を行う際、正規表現は避けて通れません。正規表現を扱う方法には「リテラル記法」と「RegExpコンストラクタ」の2種類がありますが、実務ではこれらを適切に使い分けることで、可読性の向上やパフォーマンスの最適化が可能になります。本記事では、日常的な開発で頻出する「リテラル記法」の正しい使い方と、現場で役立つTipsを解説します。
基礎知識：RegExpリテラルとは
RegExpリテラルとは、スラッシュ（/）で囲んでパターンを記述する書き方です（例：/abc/i）。JavaScriptエンジンは、スクリプトの評価時にこのリテラルをコンパイルするため、実行時のオーバーヘッドが少なく、コードが簡潔になるというメリットがあります。一方、RegExpコンストラクタ（new RegExp(‘abc’, ‘i’)）は、文字列としてパターンを組み立てるため、動的に変化するパターンを扱う際に適しています。
実装：リテラル記法の基本と注意点
リテラル記法は静的なパターンに適しています。例えば、メールアドレスのバリデーションや固定の文字列置換などはリテラルで記述するのが定石です。ただし、リテラル内部ではスラッシュ自体をエスケープする必要がある点に注意してください。
サンプルプログラム：実務で使える正規表現の活用例
以下は、リテラル記法を用いた文字列の抽出と置換の実装例です。
// 1. 基本的なリテラル記法（メールアドレス形式チェック）
const emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
const inputEmail = "example@tech-blog.com";
if (emailPattern.test(inputEmail)) {
console.log("有効なメールアドレス形式です");
}
// 2. スラッシュを含むURLを扱う場合（エスケープが必要）
// リテラル内では「/」を「\/」と記述します
const urlPattern = /https:\/\/github\.com\//;
console.log(urlPattern.test("https://github.com/")); // true
// 3. キャプチャグループを利用した文字列置換
// 「YYYY-MM-DD」を「DD/MM/YYYY」に変換する例
const dateStr = "2023-10-25";
const formatted = dateStr.replace(/(\d{4})-(\d{2})-(\d{2})/, "$3/$2/$1");
console.log(formatted); // "25/10/2023"
応用・注意点：現場で陥りやすい罠と対策
1. 動的なパターン生成での誤用
変数を使って正規表現を作りたい場合に、リテラル記法を使おうとすると失敗します。例えば `/^${variable}$/` と記述しても、`${variable}` は正規表現の一部として評価され、変数は展開されません。この場合は素直に `new RegExp(‘^’ + variable + ‘$’)` を使用しましょう。
2. フラグの管理
リテラル記法では `/pattern/g` のようにフラグを末尾に付与します。`g`（グローバル検索）フラグを付けた状態で `test()` メソッドを使用すると、正規表現オブジェクトの `lastIndex` プロパティが更新され、連続して呼び出す際に意図しない結果（2回目がfalseになる等）を招くことがあります。再利用する場合は `lastIndex` をリセットするか、新しいインスタンスを生成する運用を心がけてください。
3. 可読性の確保
複雑すぎる正規表現を一行で書くと、後のエンジニア（あるいは未来の自分）が解読できなくなります。コメントを残すか、定数として意味のある名前を付けて管理することをおすすめします。