windowオブジェクトについて

javascript

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)
  • サウンドの使用(再生等)

上記は一部の要素ですが、このブログ内で一つ一つ動かしながら確かめていく予定です。

コメントを残す

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