JavaScript・TypeScriptで正規表現を使いこなす！サンプルコードで徹底解説

2024-05-25

TypeScriptにおける正規表現（RegExp）

正規表現は、文字列のパターンを記述するための強力なツールです。電話番号、メールアドレス、URLなどの複雑なパターンを抽出したり、文字列の操作や検証を行ったりする際に役立ちます。

TypeScriptでのRegExpの利用

TypeScriptでは、JavaScriptと同様に2つの方法でRegExpオブジェクトを生成できます。

リテラル記法

const pattern = /ab+c/;

コンストラクタ

const pattern = new RegExp('ab+c');

RegExpメソッド

RegExpオブジェクトには、文字列とのマッチングや操作を行うための様々なメソッドが用意されています。代表的なメソッドは以下の通りです。

test(): 引数の文字列が正規表現パターンにマッチするかどうかを調べます。
exec(): 引数の文字列の中で、最初に正規表現パターンにマッチする部分を見つけます。
split(): 引数の文字列を、正規表現パターンで区切って配列に変換します。

例：電話番号の検証

以下は、日本の電話番号の形式に合致するかどうかを検証する例です。

const japanesePhonePattern = /^\d{3}-\d{3}-\d{4}$/;

const phoneNumber = '090-1234-5678';

if (japanesePhonePattern.test(phoneNumber)) {
  console.log('有効な電話番号です');
} else {
  console.log('無効な電話番号です');
}

TypeScriptでRegExpを使用する利点は以下の通りです。

型安全性: TypeScriptは、正規表現パターンにマッチする文字列の型を推論することができます。これは、型エラーを防ぎ、コードの信頼性を向上させるのに役立ちます。
コードの可読性: 正規表現リテラルは、読みやすく理解しやすい形式で記述することができます。
再利用性: 正規表現オブジェクトは、コード内の様々な場所で再利用することができます。

TypeScriptにおけるRegExpは、文字列の操作や検証を行うための強力なツールです。型安全性、可読性、再利用性などの利点があり、様々な場面で活用することができます。

文字列の検索

const text = "Hello, world!";
const pattern = /world/;

const match = text.match(pattern);

if (match) {
  console.log(`"${pattern}" は "${text}" にマッチしました。`);
} else {
  console.log(`"${pattern}" は "${text}" にマッチしませんでした。`);
}

const text = "JavaScript で正規表現を使う";
const pattern = /JavaScript/g;
const replacedText = text.replace(pattern, "TypeScript");

console.log(replacedText); // 出力: "TypeScript で正規表現を使う"

const text = "りんご, みかん, ぶどう";
const pattern = /,/;
const fruits = text.split(pattern);

console.log(fruits); // 出力: ["りんご", "みかん", "ぶどう"]

キャプチャグループの使用

const text = "電話番号: 090-1234-5678";
const pattern = /電話番号: (\d{3}-\d{3}-\d{4})/;

const match = text.match(pattern);

if (match) {
  console.log(`電話番号: ${match[1]}`); // 出力: 電話番号: 090-1234-5678
} else {
  console.log("電話番号が見つかりませんでした。");
}

const text = "メールアドレス: [email protected]";
const pattern = /メールアドレス: (?<user>\w+@\w+\.\w+)/;

const match = text.match(pattern);

if (match) {
  console.log(`メールアドレス: ${match.groups.user}`); // 出力: メールアドレス: [email protected]
} else {
  console.log("メールアドレスが見つかりませんでした。");
}

これらのサンプルコードは、TypeScriptにおけるRegExpの基本的な使用方法を示すものです。より複雑なパターンや操作については、RegExpに関するリファレンス資料を参照することをお勧めします。

正規表現を使った高度な文字列処理

正規表現には、サブパターンと呼ばれる機能を使って、より複雑なパターンを記述することができます。サブパターンを使用することで、パターンの一部を繰り返しマッチしたり、特定の条件を満たす部分のみをマッチしたりすることができます。

const text = "電話番号: +81-90-1234-5678";
const pattern = /電話番号: \+81-(?<area>\d{2})-(?<number>\d{4}-\d{4})/;

const match = text.match(pattern);

if (match) {
  console.log(`電話番号: +81-${match.groups.area}-${match.groups.number}`); 
  // 出力: 電話番号: +81-90-1234-5678
} else {
  console.log("電話番号が見つかりませんでした。");
}

ルックアヘッドとルックビハインドは、正規表現のパターンにマッチする前に/後に特定の文字列が存在するかを確認するための機能です。

ルックアヘッド: パターンにマッチする前に指定した文字列が存在するかどうかを確認します。

const text = "メールアドレス: [email protected]";
const pattern = /user\.(?<name>[a-zA-Z]+)@example\.com(?=com)/;

const match = text.match(pattern);

if (match) {
  console.log(`メールアドレス: ${match.groups.name}@example.com`); 
  // 出力: メールアドレス: [email protected]
} else {
  console.log("メールアドレスが見つかりませんでした。");
}

非貪欲マッチング

正規表現の中には、デフォルトで貪欲なマッチングを行うものがあります。これは、パターンにマッチする限り、可能な限り長い部分にマッチしようとすることを意味します。非貪欲マッチングを使用すると、この動作を制御することができます。

const text = "abcde123456789";
const pattern = /a.*?b/; // 非貪欲マッチング

const match = text.match(pattern);

if (match) {
  console.log(match[0]); // 出力: abcde
} else {
  console.log("パターンにマッチするものが見つかりませんでした。");
}

フラグの使用

正規表現には、マッチングの動作を制御するためのフラグが用意されています。代表的なフラグは以下の通りです。

g: すべてのマッチを検索します。
i: 大小文字を区別しません。
m: マルチラインマッチングを行います。
s: ドット(.)を改行を含む任意の文字と一致させます。
y: 行の先頭からマッチングを開始します。

const text = "りんご\nみかん\nぶどう";
const pattern = /りんご|みかん/g; // 'g' フラグを使用

const matches = text.match(pattern);

console.log(matches); // 出力: ["りんご", "みかん"]

正規表現ライブラリの利用

TypeScriptには、正規表現を扱うための様々なライブラリが用意されています。これらのライブラリを使用すると、より複雑なパターンを記述したり、便利な機能を利用したりすることができます。

これらのライブラリは、NPMパッケージマネージャーを使用してインストールすることができます。