はじめに
最近、正規表現を使う機会が増えてきたので、内容を整理してみました。
正規表現を使用することで、テキスト内に特定の検索文字列が含まれているかどうかを簡単に調べることができる。JavaScriptでは、RegExpオブジェクト、文字列のmatchメソッド、searchメソッドなどを使用して正規表現を扱うことができる。また、正規表現には大文字と小文字を区別しない検索やグローバル検索などのオプションも提供されている。これらの機能を活用して、効率的にテキストの検索やマッチングを行うことができる。
ちょっと工夫して、URLにマッチする正規表現を取得するようにも出来る。
var urlPattern = /https?://[^\s/$.?#].[^\s]*/gi;
基本的な正規表現の使用例
例1: RegExpオブジェクトを使用する
// 検索対象のテキスト
var text = "これはテストの文章です。";
// 検索文字列（正規表現）
var searchString = "テスト";
// 正規表現オブジェクトを作成
var regex = new RegExp(searchString);
// テキスト内に検索文字列が含まれているかどうかを調べる
if (regex.test(text)) {
console.log("検索文字列が見つかりました。");
} else {
console.log("検索文字列が見つかりませんでした。");
}
実行結果
検索文字列が見つかりました。
例2: 文字列のmatchメソッドを使用する
// 検索対象のテキスト
var text = "これはテストの文章です。";
// 検索文字列（正規表現）
var searchString = "テスト";
// テキスト内に検索文字列が含まれているかどうかを調べる
var result = text.match(new RegExp(searchString));
if (result) {
console.log("検索文字列が見つかりました。");
} else {
console.log("検索文字列が見つかりませんでした。");
}
実行結果
検索文字列が見つかりました。
例3: 文字列のsearchメソッドを使用する
// 検索対象のテキスト
var text = "これはテストの文章です。";
// 検索文字列（正規表現）
var searchString = "テスト";
// テキスト内に検索文字列が含まれているかどうかを調べる
var index = text.search(new RegExp(searchString));
if (index !== -1) {
console.log("検索文字列が見つかりました。");
} else {
console.log("検索文字列が見つかりませんでした。");
}
実行結果
検索文字列が見つかりました。
正規表現のオプション
正規表現にはいくつかのオプションがあります。
i 大文字と小文字を区別しない（case-insensitive）
g グローバル検索（すべての一致を検索）
m 複数行モード（^と$が各行の先頭と末尾に一致）
例4: 大文字と小文字を区別しない検索
// 検索対象のテキスト
var text = "これはテストの文章です。";
// 検索文字列（正規表現）
var searchString = "テスト";
// 大文字と小文字を区別しない正規表現オブジェクトを作成
var regex = new RegExp(searchString, "i");
// テキスト内に検索文字列が含まれているかどうかを調べる
if (regex.test(text)) {
console.log("検索文字列が見つかりました。");
} else {
console.log("検索文字列が見つかりませんでした。");
}
実行結果
検索文字列が見つかりました。
URLにマッチする正規表現を作成する
scheme://domain:port/path?query#fragment
scheme プロトコル（例: http, https, ftp）
domain ドメイン名（例: www.example.com）
port ポート番号（省略可能）
path パス（例: /path/to/resource）
query クエリパラメータ（例: ?key=value）
fragment フラグメント識別子（例: #section）
URLにマッチする正規表現の例
この正規表現は、テキスト内のURLにマッチするための基本的なパターンを提供します。URLの構造に基づいて、プロトコル、ドメイン名、パス、クエリパラメータ、フラグメント識別子などの要素を考慮しています。正規表現を使用してURLを検索することで、テキスト内のリンクを抽出したり、URLの検証を行ったりすることができます。
// URLにマッチする正規表現
var urlPattern = /https?:\/\/[^\s/$.?#].[^\s]*/gi;
// テスト用のテキスト
var text = "Visit our website at https://www.example.com or follow us on http://blog.example.com!";
// 正規表現を使用してURLを検索
var matches = text.match(urlPattern);
if (matches) {
console.log("URLが見つかりました:");
matches.forEach(function(url) {
console.log(url);
});
} else {
console.log("URLが見つかりませんでした。");
}
実行結果
URLが見つかりました:
https://www.example.com
http://blog.example.com
解説
このJavaScriptコードは、テキスト内に含まれるURLを正規表現を使用して検索し、見つかったURLをコンソールに出力するものです。正規表現は、URLの一般的な構造に基づいて設計されており、http または https で始まるURLにマッチします。match メソッドを使用してテキスト内のマッチを検索し、マッチしたURLを配列として取得します。取得したURLは、forEach メソッドを使用してループし、コンソールに出力されます。
1. URLにマッチする正規表現の定義
var urlPattern = /https?:\/\/[^\s/$.?#].[^\s]*/gi;
https? とは、httpまたはhttpsにマッチ。s?はsが0回または1回出現することを意味。
:\/\/ とは、 ://にマッチ。:と/は特殊文字なので、エスケープするためにバックスラッシュ（\）を使用。
[^\s/$.?#] とは、 空白文字、スラッシュ、ドル記号、ドット、疑問符、ハッシュ記号以外の任意の文字にマッチ。これにより、ドメイン名の最初の文字を指定。
.[^\s]* とは、 ドメイン名の残りの部分にマッチします。ドメイン名の最初の文字以降の任意の文字にマッチ。
gi とは、グローバル検索（g）と大文字小文字を区別しない検索（i）のフラグ。
2. テスト用のテキスト
var text = "Visit our website at https://www.example.com or follow us on http://blog.example.com!";
のテキストには、2つのURLが含まれています：https://www.example.com と http://blog.example.com。
3. 正規表現を使用してURLを検索
var matches = text.match(urlPattern);
text.match(urlPattern) は、テキスト内のURLにマッチする部分を検索し、マッチした部分を配列として返します。マッチが見つからない場合は null を返します。
4. マッチしたURLをコンソールに出力
if (matches) {
console.log("URLが見つかりました:");
matches.forEach(function(url) {
console.log(url);
});
} else {
console.log("URLが見つかりませんでした。");
}
if (matches) は、マッチが見つかったかどうかを確認します。マッチが見つかった場合、matches は null ではなく、マッチしたURLの配列になります。
matches.forEach(function(url) { ... }) は、マッチしたURLの配列をループし、各URLをコンソールに出力します。
マッチが見つからなかった場合、"URLが見つかりませんでした。" とコンソールに出力します。
ご参考になれば幸いです。
アプリケーション開発に集中するための方法を模索した
本記事はQmonus Value Streamの投稿キャンペーン記事です。