Webブラウザのオブジェクト

オブジェクトの階層構造

オブジェクトとは

オブジェクト指向プログラミングにおいては、ソフトウェアが扱おうとしている現実世界に存在する物理的あるいは抽象的な実体を、属性(データ)と操作(メソッド)の集合としてモデル化し、コンピュータ上に再現したもの。オブジェクトを定義するモデルはクラスと呼ばれる。クラスに基づいて実際にコンピュータのメモリ上に展開されたオブジェクトのことをインスタンス(実体)と言うが、このインスタンスの意味でオブジェクトと呼ぶ場合も多い。

オブジェクトとは 【 object 】 - 意味/解説/説明/定義 : IT用語辞典

f:id:fujiwarashinichi:20140325000025g:plain

 人間は各部分から成り立っている。図の各部分をオブジェクトといい、上図のように改造構造を持つ。同様にWebブラウザ上の主なオブジェクトは下図のように階層構造を持つ。

Webブラウザの階層構造

 オブジェクト内の

  • 変数をプロパティ
  • 関数をメソッドと呼ぶ

f:id:fujiwarashinichi:20140325000630g:plain

 

 navigatorオブジェクト

  • 個々のウィンドウに依存しないオブジェクト
  • 「for~in文」を利用して、UAのプロパティ一覧を取得する
navigator [ 'プロパティ名' ]
UserAgentのプロパティを取得する
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTf-8">
    <title>navigatorオブジェクト</title>
  </head>
  <body>
    <script>
     for (var prop in navigator) {
     document.write('<p>', prop, ':', navigator[prop], '</p>');
     }
    </script>
  </body>
</html>

navigatorオブジェクト

 

platformプロパティ

プラットフォーム(os)のタイプを取得する

osによってメッセージを変更する
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTf-8">
    <title>navigatorオブジェクト</title>
  </head>
  <body>
    <script>
     var platform = navigator.platform;
     if (platform.indexOf('Mac') >= 0 ) {
     document.write('<h1>こんにちはMacユーザーさん</h1>');
     } else if (platform.indexOf('Win') >= 0 ) {
     document.write('<h1>こんにちはWinユーザーさん</h1>');
     } else {
     document.write('<h1>こんにちはその他OSのユーザーさん</h1>');
     }
    </script>
  </body>
</html>

navigatorオブジェクト

 

indexOfメソッド

  • 文字列の中に引数で指定した文字列が含まれているかどうかを調べるメソッド
  • 見つかった場合は、文字列の先頭を「0」とした数値で位置を戻す
  • 見つからない場合は、「-1」を戻す