「入力されたメールアドレスの形式をチェックしたい」「文字列から数字だけを取り出したい」「特定の文字をまとめて置換したい」——こうした処理を強力に助けてくれるのが正規表現(せいきひょうげん)です。正規表現は「文字列のパターン」を表す書き方で、JavaScript では test()・match()・replace() などのメソッドと組み合わせて使います。この記事では、正規表現の作り方から、よく使うパターンの記号、判定・抽出・置換の方法、つまずきやすいポイントまで、初心者の方にも分かるようにコード例で解説します。
目次
正規表現とは
正規表現とは、「数字が3つ並んでいる」「@ を含む」といった文字列のパターンを表現するための記法です。これを使うと、単純な文字一致では難しい「形式が合っているか」「条件に合う部分を抜き出す」といった処理が簡潔に書けます。
JavaScript で正規表現を作るには、2つの方法があります。1つは /パターン/ のようにスラッシュで囲むリテラル記法、もう1つは new RegExp() を使う方法です。普段はリテラル記法が簡潔で読みやすく、パターンを変数から組み立てたいときだけ RegExp を使う、と考えればよいでしょう。
// リテラル記法(よく使う)
const re1 = /\d{3}/; // 数字3桁のパターン
// RegExp コンストラクタ(変数から組み立てるとき)
const word = "cat";
const re2 = new RegExp(word, "g"); // 第2引数はフラグ
よく使うパターンの記号
正規表現は、特別な意味を持つ記号を組み合わせてパターンを作ります。まずは代表的なものを覚えましょう。これらを組み合わせるだけで、かなり多くのパターンを表現できます。
| 記号 | 意味 |
|---|---|
\d | 数字1文字(0〜9) |
\w | 英数字とアンダースコア1文字 |
\s | 空白文字(スペース・タブなど) |
. | 任意の1文字 |
* | 直前のパターンの0回以上の繰り返し |
+ | 1回以上の繰り返し |
? | 0回か1回(省略可能) |
{n} | ちょうど n 回 |
^ / $ | 行の先頭 / 末尾 |
[abc] | a・b・c のいずれか1文字 |
たとえば /^\d{3}-\d{4}$/ は「数字3桁・ハイフン・数字4桁」だけからなる文字列、つまり郵便番号の形式を表します。^ と $ で挟むことで、「その形式に完全に一致するか」を判定できます。
test:一致するか判定する
test() は正規表現のメソッドで、文字列がパターンに一致すれば true、しなければ false を返します。形式チェックにそのまま使えるので、もっとも手軽な判定方法です。
const zip = /^\d{3}-\d{4}$/; // 郵便番号の形式
zip.test("123-4567"); // true
zip.test("1234567"); // false(ハイフンがない)
zip.test("abc-defg"); // false(数字でない)
match:一致した部分を取り出す
文字列のメソッド match() は、パターンに一致した部分を取り出して返します。g フラグ(後述)を付けると、一致したものすべてを配列で受け取れます。文字列から数字や特定の語を抜き出したいときに便利です。
const text = "りんご3個、みかん12個";
// 数字(1桁以上)をすべて取り出す
const nums = text.match(/\d+/g);
console.log(nums); // ["3", "12"]
カッコ ( ) でグループを作ると、一致した中の特定の部分だけを取り出せます。日付の年・月・日を分けて取得する、といった使い方ができます。
const date = "2026-06-30";
const m = date.match(/(\d{4})-(\d{2})-(\d{2})/);
// m[0] は全体、m[1] 以降がグループ
console.log(m[1]); // "2026"(年)
console.log(m[2]); // "06"(月)
console.log(m[3]); // "30"(日)
replace:パターンに一致した部分を置換する
文字列の replace() は、正規表現と組み合わせるとパターンに一致した部分すべてを置換できます。通常の文字列指定では最初の1つしか置換されませんが、正規表現に g フラグを付けると、一致したすべてが対象になります。
// 連続する空白を1つの半角スペースにまとめる
const messy = "a b c";
messy.replace(/\s+/g, " "); // "a b c"
// 数字をすべて * に置き換える
"TEL: 090-1234-5678".replace(/\d/g, "*"); // "TEL: ***-****-****"
フラグ(g・i)の使い方
正規表現の末尾に付ける文字をフラグと呼び、検索のしかたを変えます。よく使うのは g と i です。複数まとめて /.../gi のように指定することもできます。
| フラグ | 意味 |
|---|---|
g | 一致するものすべてを対象にする(global) |
i | 大文字・小文字を区別しない(ignore case) |
m | ^ / $ を行ごとに扱う(multiline) |
"Hello hello HELLO".match(/hello/gi);
// ["Hello", "hello", "HELLO"](大文字小文字を無視して全部)
思いどおりに一致しないとき
記号がそのまま解釈されてしまう
. や ?、( などは正規表現で特別な意味を持つため、文字そのものとして検索したいときは前に \ を付けてエスケープします。たとえばドットを探すなら /\./ と書きます。URL やファイル名の . をそのまま扱いたいときに注意が必要です。
欲張りに一致してしまう
* や + は、既定でできるだけ長く一致しようとします(最長一致)。たとえば /<.+>/ を "<a><b>" に使うと、全体の "<a><b>" に一致してしまいます。最短で止めたいときは +? のように ? を付けて最短一致にします。
メールアドレスの完全な検証は難しい
正規表現はメール形式のチェックにもよく使われますが、すべての正しいメールアドレスを正確に判定する正規表現を書くのは非常に困難です。フォームでの簡易チェックには type="email" や「@ を含むか」程度の緩いパターンを使い、本当に届くかどうかは確認メールの送信で検証する、という考え方が実用的です。
まとめ
正規表現は、文字列のパターンを使って判定・抽出・置換を行う強力な道具です。要点を整理します。
- 作り方は
/パターン/フラグのリテラル記法が基本。 \d・\w・.・+・{n}・^$などの記号を組み合わせてパターンを作る。- 判定は
test()、抽出はmatch()、置換はreplace()。 gですべて、iで大文字小文字を無視。グループは( )で取り出す。- 記号は
\でエスケープ。最短一致は+?。メールの完全検証は避ける。
正規表現は最初はとっつきにくいですが、\d+ や \s+ といったよく使うパターンから慣れていくと、文字列処理が一気に楽になります。まずは test() での形式チェックから試してみてください。