JavaScriptでURLの形式を判定するサンプルコード集

現代のWeb開発において、URLの形式を正しく扱うことは非常に重要です。

JavaScriptには、URLの形式を判定するための方法が複数あります。例えば、正規表現を使用する方法や、URLオブジェクトを使用する方法など様々です。

この記事では、JavaScriptでURLの形式を判定する方法について、具体的なサンプルコードを交えて解説します。

JavaScriptでURLの形式判定サンプルコード

正規表現を使用する方法

const urlRegex = /^(?:(?:https?|ftp):\/\/)?(?:www\.)?[a-z0-9\-]+(?:\.[a-z]{2,})+(?:\/[\w\-\.\?\=\&\#\%\+\,]*)*$/i;

const url = "https://www.example.com/path/to/file?query=value";

if (urlRegex.test(url)) {
  console.log("URLが正しい形式です");
} else {
  console.log("URLが正しい形式ではありません");
}

URLオブジェクトを使用する方法

const url = "https://www.example.com/path/to/file?query=value";

try {
  new URL(url);
  console.log("URLが正しい形式です");
} catch (e) {
  console.log("URLが正しい形式ではありません");
}

どちらの方法でも、正しい形式のURLであればtrueを返し、正しくない形式のURLであればfalseを返します。URLオブジェクトを使用する際は、エラーをキャッチするためにtry...catch文を使用しURL形式を判定しています。

まとめ

この記事では、JavaScriptでURLの形式を判定する方法について、正規表現とURLオブジェクトの2つの方法を紹介しました。

正規表現を使用する方法は、比較的古くから使われている方法で、様々なプログラミング言語で使用されています。一方で、URLオブジェクトを使用する方法は、JavaScriptに特化した方法であり、コードが簡潔になるため、可読性が高いと言えます。

どちらの方法を使用するにせよ、自分のプロジェクトに合わせて、より適した方法を選択することが重要です。