JavaScript 逆引き集 | 正規表現で部分抽出(キャプチャ)

JavaScript JavaScript
スポンサーリンク

JavaScript正規表現で部分抽出(キャプチャ)の基本と実践

正規表現の キャプチャグループ (...) を使うと、文字列の一部を抜き出せます。match の返り値は配列で、[0] に「全体一致」、[1] 以降に「キャプチャ部分」が入ります。ES6以降は 分割代入 を使うとスマートに取り出せます。


基本の構文

const m = s.match(/(pattern)/);
if (m) {
  console.log(m[0]); // 全体一致
  console.log(m[1]); // キャプチャ部分
}

// 分割代入で直接取り出す
const [, captured] = s.match(/(pattern)/) || [];
JavaScript
  • m[0]: 正規表現全体に一致した文字列
  • m[1]: 最初のキャプチャグループ
  • 複数グループ: m[2], m[3] …と続く
  • 分割代入: const [,p] = ...[1] を直接変数に入れられる

すぐ使えるテンプレート集

単純な部分抽出

const s = "foo bar";
const [, p] = s.match(/(foo)/) || [];
console.log(p); // "foo"
JavaScript
  • ポイント: || [] を付けると一致しなかった場合でもエラーにならない。

数字だけを抜き出す

const s = "Price: 1200 yen";
const [, price] = s.match(/(\d+)/) || [];
console.log(price); // "1200"
JavaScript
  • ポイント: \d+ で連続数字をキャプチャ。数値化したいなら Number(price)

日付を分解して抽出

const s = "2025-12-04";
const m = s.match(/(\d{4})-(\d{2})-(\d{2})/);
if (m) {
  const [, year, month, day] = m;
  console.log(year, month, day); // "2025" "12" "04"
}
JavaScript
  • ポイント: 複数キャプチャを分割代入で一気に取り出せる。

名前付きキャプチャ(ES2018+)

const s = "User: Aki, Age: 22";
const m = s.match(/User:\s(?<name>\w+),\sAge:\s(?<age>\d+)/);
console.log(m.groups.name); // "Aki"
console.log(m.groups.age);  // "22"
JavaScript
  • ポイント: (?<name>...) のように名前を付けると m.groups から参照できる。

複数一致を全部取りたいなら matchAll

const s = "ID=12; ID=34;";
const re = /ID=(\d+)/g;
for (const m of s.matchAll(re)) {
  console.log(m[1]); // "12" → "34"
}
JavaScript
  • ポイント: matchは最初の一致だけ。全件+キャプチャなら matchAll。

よくある落とし穴と対策

  • 一致しないとnull: s.match(...) が null のときに分割代入するとエラー。|| [] を付けて安全に。
  • gフラグとの違い: /.../g を付けると match は「一致文字列の配列」になり、キャプチャは返されない。キャプチャが欲しいなら gなし、全件+キャプチャなら matchAll。
  • キャプチャ番号のずれ: 複数の () があると番号がずれる。名前付きキャプチャを使うと安心。
  • 改行にドットがマッチしない: 改行を含めたいなら [\s\S] か sフラグを使う。

練習問題(手を動かして覚える)

  • 1. 数字を抜き出す
const s = "Order #5678";
const [, id] = s.match(/#(\d+)/) || [];
console.log(id); // "5678"
JavaScript
  • 2. 日付を分解
const s = "2025-12-04";
const [, y, m, d] = s.match(/(\d{4})-(\d{2})-(\d{2})/) || [];
console.log(`${d}/${m}/${y}`); // "04/12/2025"
JavaScript
  • 3. 名前付きキャプチャで抽出
const s = "User: Ren, Age: 20";
const m = s.match(/User:\s(?<name>\w+),\sAge:\s(?<age>\d+)/);
console.log(m.groups); // { name: "Ren", age: "20" }
JavaScript

直感的な指針

  • 1件+部分抽出: match+キャプチャ。
  • 複数部分を一気に: 分割代入。
  • 全件+部分抽出: matchAll。
  • 番号ずれを避けたい: 名前付きキャプチャ。

タイトルとURLをコピーしました