【JavaScript】URLをスラッシュごとに分割する方法

URLをスラッシュ（/）ごとに分割したい場合は、JavaScriptの split() メソッドを使用します。処理の前に toString() メソッドで値を文字列に変換しておくのがポイントです。ここでは、具体的なサンプルコードと実行結果を交えて解説します。

サンプルコード

var newURL = "https://www.example.com/index.html/homePage/aboutus/";
console.log(newURL);
var splitURL = newURL.toString().split("/");
console.log(splitURL);

上記の例では、split() 関数の引数としてフォワードスラッシュ（"/"）を指定しています。これにより、URL内の各スラッシュの位置で文字列が分割され、その結果が配列として返されます。

プログラムの実行方法

上記のプログラムはNode.js環境で動作します。ターミナルから次のコマンドを実行してください。

node fileName.js

出力結果

ここでは、ファイル名を demo150.js として実行しています。実行すると、コンソールに以下のような出力が表示されます。

PS C:\Users\Amit\JavaScript-code> node demo150.js
https://www.example.com/index.html/homePage/aboutus/
[
    'http:',
    '',
    'www.example.com',
    'index.html',
    'homePage',
    'aboutus',
    ''
]

出力結果のポイント

split("/") を使うと、プロトコル部分（http:）、ドメイン名（www.example.com）、パスの各セグメント（index.html、homePage、aboutus）が個別の要素として配列に格納されます。また、URLの末尾がスラッシュで終わっている場合や、「//」のように連続したスラッシュがある場合は、空文字（''）が配列の要素として含まれる点に注意が必要です。

空の要素を除外したい場合は、filter() メソッドを組み合わせると便利です。

var cleanSplit = newURL.split("/").filter(function(part) {
    return part !== "";
});
console.log(cleanSplit);
// ['http:', 'www.example.com', 'index.html', 'homePage', 'aboutus']