windowオブジェクトについて
クライアントサイドでのjavascriptでは、windowオブジェクトが一番最初のスコープチェーンと考えることができます。
windowオブジェクトのプロパティやメソッドは、グローバル変数、グローバル関数としてみることができます。
例えば次のような非常にシンプルなHTMLを作成し、main.js内にwindowオブジェクトのlocationプロパティに値を設定する。
というファイルを用意して、ブラウザからhtmlファイルにアクセスすると、locationに設定したURLを読み込む動きになります。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>test</title> <script src="./main.js"></script> </head> <body> test123 </body> </html>
//指定URLへ遷移する window.location = "https://google.com";
上記の例は、windowオブジェクトに対してのプロパティを操作しましたが、
メソッドも用意されています。
例えば、次のように書きます。
window.setTimeout(function() { console.log("set!"); }, 5000);
この場合は5秒後にconsoleログ出力が一度だけされます。
setTimeout命令(メソッド)により、引数に定義した無名関数が、第二引数の5000ミリ秒後に実行される。という仕組みです。
この時、「window.」と明示的に指定していますが、setTimeoutのみを記述しても動作します。
windowオブジェクトはグローバルオブジェクトなので、windowオブジェクトが持つメソッドもグローバルメソッド(グローバル関数)として使うことができます。
また、ブラウザ上で実行するjavascriptでは、下記のプログラム要素があります。
- windowオブジェクト(上記以外の使い方)
- style(css)の制御
- DOMの制御
- HTML5APIの使用
- グラフィックの描画(canvas)
- サウンドの使用(再生等)
上記は一部の要素ですが、このブログ内で一つ一つ動かしながら確かめていく予定です。