jsでよく目にするwindowオブジェクトとは??

目次

windowオブジェクト、
最近まで window.onloadしか使ったことなかったのですが
思ったより面白かったのでまとめました!

windowとは

windowオブジェクトは画面上に表示されている全てのオブジェクトの親となるオブジェクトです。
下位のオブジェクトとして

オブジェクトがあります。

window.historyオブジェクト

ブラウザの履歴を操作したり画面に出ているページを移動したりするためのオブジェクトです。

・historyオブジェクトのプロパティー

[f:id:okinawanpizza:20200809163352p:plain]
このブラウザでは「urlを検索」し「出てきたリンクを開いた」ので二つのURIを保持しています。
なので window.length を実行すると2が帰ってきます。

・historyオブジェクトのメゾット達

lengthオブジェクト、、聞いたことなかったけど
意外と見覚えのある挙動でした。

windowオブジェクトのプロパティー・メソッド

一部を紹介していきます。

See the Pen
window!!!
by たまき こう (@ulqvhvox)
on CodePen.

ちなみに

こちらを実行するとopenの中に書いてあるリンクを開いてくれます。

会社のコーポレートサイトで、以前aタグのhrefの内容を書き換えても
指定したリンクに飛ばない問題がありましたが
調べてみるとjsでopen()を使って上書きされていました。。

windowオブジェクトのメソッドを使うときは 'window.'を省略できる!

そう、実は

などのメソッドはそれぞれwindow.alert widnow.setTimeout window.scrollToでも実行できます。
windowオブジェクトのメソッドはwindowオブジェクトを省略して実行することが可能です。

こういう風にwindowオブジェクトを使うと
新しいウィンドウを表示したり、ページ遷移させたりすることができるのでした。

Back to Top