JavaScript 　オブジェクト指向

@cev_cs

本日の予定前回の確認

基本用語解説

クラスベースとプロトタイプベース

オブジェクトの定義

JSON と JSONP

前回の確認関数も「オブジェクト」である JavaScript の大きな特徴の１つ

オブジェクトは全て連想配列 から出来ている 連想配列とはキーと要素の集合 配列名 [‘ キー’ ] 　＝　配列名 . キー

用語の確認

クラスベースとプロトタイプベース

今まで習ってきた言語 : クラスベース

プロトタイプ → 　あるオブジェクトの元となるオブジェクト 　より縛りの弱いクラスのようなもの

プロトタイプベースの利点・欠点

利点•メモリ使用量が小さくなる

欠点•クラスが存在しない

→JS が遅い原因の一つ•最初はややこしい

縛りの弱いクラスのようなものである「プロトタイプ」を

便宜的に「クラス」

と書かせて頂きます。

オブジェクトの定義最もシンプルな定義方法

var Member = function() {} ; // コンストラクタ

var mem = new Member(); // インスタンス生成 mem.name = 'agu_it_study'; mem.myfunc = function(){ .... };

※ インスタンスには動的にメソッドを追加可能 mem は Member オブジェクト 補足資料　→　 http://bit.ly/9IIWNf

オブジェクトの定義コンストラクタに中身を挿入

var Member = function (name){ this.name = name; this.printName = function (){ document.write(this.name); }; };

this は生成されたインスタンスを指す

コンストラクタの問題点メソッドの数に比例して余分にメモリを消費する

prototype プロパティ

関数は元のクラスを参照するようにする

コードで書くと var Member = function (name){ this.name = name; }; Member.prototype.printName = function (){ document.write(this.name); };

var mem1 = new Member ('Homma'); var mem2 = new Member ('Matsue');

実行サンプル http://jsdo.it/cev/huKj

JSON(JavaScript Object Notation)

オブジェクト表記方法をそのまま通信データの形式に用いる手法

サーバ側にあるデータを JavaScript だけで利用できる →　マッシュアップ

JSON(JavaScript Object Notation)

サーバから以下の「文字列」が返ってくる { ‘age’ : 21, ‘department’ : ‘Information Technology’ }

まさに前回行った「オブジェクト （連想配列） 」！

JSONP (JSON with padding)

callback 関数を定義引数に JSON を指定して callback を実行

クロスドメイン制約通常は外部のソースにアクセスできない

まとめ

JavaScript はプロトタイプベース

prototype によってメモリ節約

JSON はオブジェクトの受け渡しJSONP で外部のデータを読み込める

終わりに

文法はこれにて終了です。

次週からいよいよブラウザを用いた内容となります。

参加型の内容を考え中です！

参考文献

JavaScript マスターブック　山田祥寛 ( 著 )

JavaScript のイロハhttp://builder.japan.zdnet.com/sp/javascript-kickstart-2007/?p=1