JavaScript正規表現：グループを使いこなして処理を効率化
JavaScriptの正規表現で一致したグループにアクセスする方法
グループにアクセスする方法
match メソッドは、正規表現と一致する部分文字列を配列として返します。この配列の最初の要素は、全体一致した文字列です。そして、2番目以降の要素は、グループに一致した文字列が順番に格納されます。
const str = "123-456-7890";
const regex = /(\d{3})-(\d{3})-(\d{4})/;
const matches = str.match(regex);
console.log(matches); // ["123-456-7890", "123", "456", "7890"]
この例では、電話番号を表す正規表現を使用しています。(\d{3}) というグループは、3桁の数字に一致します。そして、matches 配列の 2番目から 4番目までの要素には、それぞれグループに一致した数字が格納されています。
exec メソッドは、match メソッドと似ていますが、オブジェクト形式で結果を返します。このオブジェクトには、groups プロパティがあり、グループに一致した文字列が格納されています。
const str = "123-456-7890";
const regex = /(\d{3})-(\d{3})-(\d{4})/;
const result = regex.exec(str);
console.log(result.groups); // { "0": "123-456-7890", "1": "123", "2": "456", "3": "7890" }
この例では、exec メソッドを使用して、グループに一致した文字列を取得しています。result.groups オブジェクトには、グループ番号をキーとして、一致した文字列が格納されています。
部分文字列の抽出
グループを使用することで、特定の部分文字列を簡単に抽出することができます。
const str = "John Doe, 30 years old";
const regex = /(.+), (\d+) years old/;
const matches = str.match(regex);
const name = matches[1]; // "John Doe"
const age = matches[2]; // "30"
console.log(name, age); // "John Doe" 30
テンプレートリテラル
グループを使用して、テンプレートリテラルに動的に値を挿入することができます。
const str = "John Doe";
const age = 30;
const regex = /(.+), (\d+) years old/;
const result = regex.exec(str);
const message = `Hello, ${result.groups[1]}! You are ${result.groups[2]} years old.`;
console.log(message); // "Hello, John Doe! You are 30 years old."
この例では、result.groups オブジェクトを使用して、テンプレートリテラルに名前と年齢を挿入しています。
JavaScriptの正規表現で一致したグループにアクセスするには、match メソッドまたは exec メソッドを使用することができます。グループを活用することで、部分文字列の抽出やテンプレートリテラルへの動的な値挿入など、さまざまな処理を行うことができます。
- [JavaScript で正規表現のグループ化を使って match メソッドで文字列を抽出する方法を現役エンジニアが解説
// 1. 電話番号の抽出
const str = "123-456-7890";
const regex = /(\d{3})-(\d{3})-(\d{4})/;
// match メソッドを使用
const matches = str.match(regex);
console.log(matches); // ["123-456-7890", "123", "456", "7890"]
// exec メソッドを使用
const result = regex.exec(str);
console.log(result.groups); // { "0": "123-456-7890", "1": "123", "2": "456", "3": "7890" }
// 2. 名前と年齢の抽出
const str = "John Doe, 30 years old";
const regex = /(.+), (\d+) years old/;
// match メソッドを使用
const matches = str.match(regex);
const name = matches[1]; // "John Doe"
const age = matches[2]; // "30"
console.log(name, age); // "John Doe" 30
// exec メソッドを使用
const result = regex.exec(str);
console.log(result.groups); // { "0": "John Doe, 30 years old", "1": "John Doe", "2": "30" }
// 3. テンプレートリテラル
const str = "John Doe";
const age = 30;
const regex = /(.+), (\d+) years old/;
// exec メソッドを使用
const result = regex.exec(str);
// テンプレートリテラルに挿入
const message = `Hello, ${result.groups[1]}! You are ${result.groups[2]} years old.`;
console.log(message); // "Hello, John Doe! You are 30 years old."
このコードを参考に、さまざまな方法でグループを活用してみてください。
グループにアクセスするその他の方法
名前付きキャプチャグループを使用すると、グループに名前を付けることができます。名前を付けることで、グループ番号ではなく名前でアクセスすることが可能になります。
const str = "John Doe, 30 years old";
const regex = /(?<name>.+), (?<age>\d+) years old/;
const result = regex.exec(str);
console.log(result.groups.name); // "John Doe"
console.log(result.groups.age); // "30"
この例では、(?<name>.+) と (?<age>\d+) という名前付きキャプチャグループを使用しています。result.groups オブジェクトには、名前をキーとして、一致した文字列が格納されています。
ループ処理
match メソッドまたは exec メソッドの結果は、配列またはオブジェクトです。ループ処理を使用して、グループに個別にアクセスすることができます。
const str = "123-456-7890";
const regex = /(\d{3})-(\d{3})-(\d{4})/;
const matches = str.match(regex);
for (const match of matches) {
console.log(match);
}
この例では、match メソッドの結果をループ処理して、グループに個別にアクセスしています。
デストラクチャリング
exec メソッドの結果は、オブジェクトです。デストラクチャリングを使用して、グループを個別の変数に格納することができます。
const str = "John Doe, 30 years old";
const regex = /(.+), (\d+) years old/;
const { name, age } = regex.exec(str).groups;
console.log(name, age); // "John Doe" 30
この例では、exec メソッドの結果をデストラクチャリングして、name と age という変数に格納しています。
JavaScriptの正規表現で一致したグループにアクセスするには、さまざまな方法があります。状況に合わせて、最適な方法を選択してください。
javascript regex
