locationオブジェクト

javascript

locationオブジェクト

locationオブジェクトを試してみます。
locationオブジェクトはウィンドウに表示されているURLを表したり、その他ウィンドウのURLに関連する操作を行えます。
このオブジェクトに対して、メソッドやプロパティを試してみます。

簡単にURL関連のlocationオブジェクトを表示してみます。

console.log(window.location.href);
console.log(location.href);
console.log(Location.href);

上の例では、わざと間違った記述をしてみました。
結果は、

https://javascriptを実行したドメイン名/
https://javascriptを実行したドメイン名/
undefined

という結果になりました。
3つめの命令では、locationの先頭の文字が大文字の為、オブジェクトとして解釈できなかった為、undefinedになりました。

また、1つめと2つめの違いは、「window.」を記述するかしないか。という違いでしたが、
これはlocationオブジェクト自体windowオブジェクトなので、省略しても2つめの記述が問題なく動作することがわかります。

それでは、別な例を試してみます。

console.log(location.host);
console.log(location.hostname);
console.log(location.protocol);
console.log(location.port);
console.log(location.pathname);
console.log(location.search);
console.log(location.hash);

それぞれ実行した結果は

propansystem.net
propansystem.net
https: main.js
<empty string> main.js
/実行したjavascriptまでのパス/ main.js
<empty string> main.js
<empty string>

という結果になりました。

ここでは詳しい言語仕様は割愛しますが、上記のサンプルを動作した際のURLに対し、
もしURLの末尾にパラメータが「index.php?aaa=1&bbb=2&ccc=3」のように付与されている場合は、
location.searchの結果が

?aaa=1&bbb=2&ccc=3

という出力になります。
javascriptでは、URLのパラメータを利用してはいけないというルールはないので、
開発プログラムによっては、サーバサイドプログラムのGETの値と同様の実装の仕方ができると言えます。
(例えばPHP言語だと「$_GET」パラメータのように)

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です