こんにちは！フロントエンドの現場を渡り歩いてきた、いわゆる「おじさんアーキテクト」の私です。
JavaScriptの勉強、毎日お疲れ様です！
コードを書いていると、「この文章の中から、特定の一文だけ抜き出したい！」「メールアドレスの形になっているかチェックしたい！」なんて壁にぶつかることが本当によくありますよね。
そんなとき、文字探しの強力な相棒になってくれるのが、今回お話しする `String.prototype.match()`（マッチメソッド） という子です。
「正規表現」なんて聞くと、それだけで冷や汗が出ちゃうかもしれませんが、大丈夫ですよ。今日は難しい専門用語はなるべく封印して、身近な例え話と一緒に、ゆっくり紐解いていきましょう！
—
1. `match()` メソッドって、例えるならどんな道具？
JavaScriptの世界で、文字列（String）を扱う方法はたくさんあります。「ここからここまでを切り取る」なら `slice()`、「別の言葉に置き換える」なら `replace()` ですよね。
じゃあ、`match()` は何をしてくれるのか？
イメージとしては、「宝探しの探知機」 や、図書館の司書さんが 「指定した条件のキーワードが載っているページをまとめて付箋を貼ってくれる姿」 を思い浮かべてください。
例えば、「今日の晩ご飯は、カレーライスと、あとカレーパンも食べたいな」という文章があったとします。
ここに `match()` を使うと、「『カレー』っていう言葉、全部でいくつあったよ！はい、これが見つかったリストです！」 と、ピカピカの配列（Array）にして返してくれるんです。
もし、1つも引っかからなかったら？
「すみません、見当たりませんでした……」と、そっと `null`（空っぽ）を返してくれます。この「見つからなければ `null`」というのが、後々プログラムの条件分岐でめちゃくちゃ役立つんですよ。
—
2. 初めての `match()` と「正規表現」の基本
さて、この `match()` を動かすためには、「正規表現（Regular Expressions）」 という、ちょっと変わった書き方をセットで覚える必要があります。
「正規表現」なんてカッコいい名前ですが、要は「文字のパターンの指定ルール」です。
JavaScriptでは、このルールを ` / `（スラッシュ）で挟んで書きます。
百聞は一見に如かず。実際にコードを見てみましょう。
// ターゲットとなる文字列
const message = “私のラッキーナンバーは 7 と 99 です。”;
// 「数字」を探すための正規表現ルールを作ります
// \d は「半導体のように並んだ数字のどれか1文字」、+ は「それが1文字以上続く場所」という意味です
const pattern = /\d+/g;
// match()で探知機をスイッチオン！
const results = message.match(pattern);
console.log(results);
// 出力結果: [“7”, “99”]
どうですか？ 文字列の中から、上手に数字だけを抜き出してくれましたね！
ここで登場した `/` で囲まれた `\d+` が正規表現です。最初は呪文のように見えるかもしれませんが、慣れてくるとこれがパズルみたいで楽しくなってくるから不思議です。
—
3. ここでつまずきやすい！「`g`（グローバル）」の魔法
`match()` を使うときに、初学者の皆さんが一番ハマりやすいポイントがあります。
それは、「最初に見つかった1個だけで満足して終わっちゃう問題」 です。
実は、正規表現のルールに「全部探してね」という目印をつけ忘れると、`match()` は真面目すぎて、最初に見つけた瞬間に仕事を終えて帰ってきちゃうんです。
文字の後ろについている `g` というアルファベット、気になりませんでしたか？
const text = “りんご と ごりら と らっぱ”;
—
// パターンA： 「g」をつけない場合
const resultA = text.match(/り/);
console.log(resultA);
// 出力結果: [“り”] （最初に見つかった「りんご」の「り」だけで終了！）
—
// パターンB： 「g」をつける場合（global＝全体という意味）
const resultB = text.match(/り/g);
console.log(resultB);
// 出力結果: [“り”, “り”, “り”] （文章全体の「り」をすべてキャッチ！）
この `g`（グローバルフラグ）を忘れて、「あれ？ 1個しか取れないぞ…？」と悩むのは、エンジニア全員が通る「あるある」の通過儀礼です。
もし文章全体からゴッソリ見つけたいときは、スラッシュの右側に `g` を添えるのを忘れないであげてくださいね。
—
4. 実務でよくある使い方：見つかったかどうかで分岐する
実際のWeb制作やアプリ開発では、「何が見つかったか」のリストそのものよりも、「そもそもその文字が含まれているか（真偽値のチェック）」 のために `match()` が使われることも多いです。
例えば、ユーザーが入力したフォームの中に「URL」が含まれていたら警告を出したい、そんなシチュエーションを想像してみましょう。
// ユーザーからのコメント（仮）
const userComment = “私のブログは https://example.com です。見てね！”;
// URLの雰囲気をキャッチする正規表現
const urlPattern = /https?:\/\//;
// match()を実行
const foundUrl = userComment.match(urlPattern);
if (foundUrl !== null) {
// nullじゃなければ、何かしらマッチしたということ！
console.log(“⚠️ 注意：コメントにURLが含まれています！”);
} else {
// nullだったら、URLは含まれていない
console.log(“✅ クリーンなコメントです。投稿OK！”);
}
このように、「見つかったらラッキー（あるいは警告）、見つからなければ `null`」という性質を利用して、プログラムの流れをコントロールできるのです。
—
5. チーフアーキテクトからの温かいメッセージ
正規表現と `match()` メソッドのコンビは、最初は本当に複雑な暗号に見えます。
「こんなの覚えられないよ……」と落ち込む必要は全くありません。現場でバリバリコードを書いているプロたちだって、難しいパターンを書くときは毎回Google検索したり、専用のチェッカーツールとにらめっこしたりしています。
まずは、
- 「文字列の中から特定のパターンを探す道具なんだな」
- 「全部探したいときは、後ろに `g` をつけるんだな」
- 「見つからなかったら `null` を返すんだな」
この3つだけ、心の片隅に置いておいてもらえれば大満点です。
焦らず、自分のペースで、一つひとつコードをエディタに貼り付けて動かしてみてくださいね。あなたのプログラミングの旅を、いつだって応援しています！
コメント