◆JavaScriptクラス宣言
◆プロトタイプ・ベースのオブジェクト指向
・JavaScriptでは関数オブジェクトにクラスとしての役割を与えている
・コンストラクタとは、オブジェクトを生成する際に
自動的に呼び出される関数（メソッド）のこと
・本質的な違いはない、new演算子で呼び出すか、
関数として呼び出すかの違う
・オブジェクト共通で利用するプロパティ（メンバ変数）などを
定義するのがコンストラクタの役割
・インスタンスに追加したメンバは、
（オブジェクト共通ではなく）そのインスタンスのみで有効である
それぞれのインスタンスのためにメモリを確保す
・「プロトタイプ・ベースのオブジェクト指向」
＝単にクラスという抽象化された設計図が存在しない
//◆クラス定義(※コンストラクタに近い)
//・戻り値を返す必要がない
//・オブジェクトの初期化
var Animal = function() {};
//インスタンス作成
var anim = new Animal();
//◆プロパティ・メソッド宣言
//・thisキーワードは新たに生成されるオブジェクトを表す
//・値として関数オブジェクトが渡されたプロパティがメソッドと見なされる
var Animal = function(name, sex) {
//プロパティ
this.name = name;
this.sex = sex;
//メソッド
this.toString = function() {
window.alert(this.name + " " + this.sex);
}
var anim = new Animal("トクジロウ", "オス");
anim.toString(); // 「トクジロウ オス」
//◆メソッド追加
//・インスタンスに対して動的にメソッドを追加できる(動的性質)
//・インスタンスへのメソッドの追加は
// あくまでインスタンス（ここではanim）への追加
//・インスタンス、あるいはコンストラクタ経由で
// 追加したメンバはdelete演算子（後述）で削除することも可能
var Animal = function(name, sex) {
this.name = name;
this.sex = sex;
}
var anim = new Animal("トクジロウ", "オス");
anim.toString = function() {
window.alert(this.name + " " + this.sex);
};
anim.toString(); // 「トクジロウ オス」
var anim2 = new Animal("リンリン", "メス");
anim2.toString(); // エラー発生
//◆プロトタイプ
//・コンストラクタでメソッドを追加するのは好ましいことではない
//・クラス（コンストラクタ）はインスタンスを生成する都度、
//・すべてのオブジェクトは「prototype」という名前のプロパティを公開している
//・prototypeプロパティは、デフォルトで何らプロパティを持たない
// 空のオブジェクト（プロトタイプ・オブジェクト）を参照している
//・ここで追加されたメンバは、そのままインスタンス化された先の
// オブジェクトに引き継がれる
//・関数オブジェクトをインスタンス化した場合、インスタンスは
// 基となる関数オブジェクトに属するprototypeオブジェクトに対して、
// 暗黙的な参照を持つことになる
var Animal = function(name, sex) {
this.name = name;
this.sex = sex;
}
Animal.prototype.toString = function() {
window.alert(this.name + " " + this.sex);
};
var anim = new Animal("トクジロウ", "オス");
anim.toString(); // 「トクジロウ オス」
//◆プロトタイプ・オブジェクトを介する利点
//（1）必要なメモリ量を節約できる
//・プロトタイプに対する暗黙的な参照が利用されるのは、読み込みの場合だけ
//・この状態を、インスタンスa1のnameプロパティが
// プロトタイプ・オブジェクトのnameプロパティを
// 「隠ぺいする」といういい方をする場合もある。
//・この考え方はdelete演算子の場合でも同様
//・「delete Animal.prototype.name」のように記述すれば、
// プロトタイプ・オブジェクトのメンバを削除することも可能だ
//・undefined値でプロトタイプ・オブジェクトメンバを無効化することもできる
//（2）プロトタイプ・オブジェクトの変更はリアルタイムに認識
//・インスタンスを生成した「後」に、基となるプロトタイプ・オブジェクトに
// メンバを追加した場合にも、これを認識できる
var Animal = function() {};
Animal.prototype.name = "サチ";
var a1 = new Animal();
var a2 = new Animal();
window.alert(a1.name + "｜" + a2.name); // 「サチ｜サチ」
a1.name = "トクジロウ";
window.alert(a1.name + "｜" + a2.name); // 「トクジロウ｜サチ」
delete a1.name; // インスタンスa1のnameプロパティを削除
delete a2.name; // インスタンスa2のnameプロパティを削除
window.alert(a1.name + "｜" + a2.name); // 「サチ｜サチ」
//◆プロトタイプをオブジェクト・リテラルで定義する
//・リテラルとは、任意の式内に直接に記述可能なデータ値（表現）のこと
var Animal = function(name, sex){
this.name = name;
this.sex = sex;
}
Animal.prototype = {
getVoice : function() {
window.alert(this.name + "「チュウ！」");
},
toString : function() {
window.alert(this.name + " " + this.sex);
}
};
var anim = new Animal("トクジロウ", "オス");
anim.toString(); // 「トクジロウ オス」
◆プロトタイプ・チェーン － JavaScriptの継承機構 －
//・継承関係を自由に変更可能
//・いったん形成されたプロトタイプ・チェーンは
// その後の変更にかかわらず保存される
----------------------------
var Animal = function() {}
Animal.prototype = {
walk : function() {
window.alert("トコトコ");
}
};
var Hamster = function() {};
Hamster.prototype = new Animal();
Hamster.prototype.gnaw = function() {
window.alert("ガジガジ…");
};
var ham = new Hamster();
ham.walk(); // 「トコトコ」 ［A］
ham.gnaw(); // 「ガジガジ…」
----------------------------
var Animal = function() {}
Animal.prototype = {
walk : function() {
window.alert("トコトコ");
}
};
var SuperAnimal = function() {}
SuperAnimal.prototype = {
walk : function() {
window.alert("ダーッ！");
}
};
var Hamster = function() {};
Hamster.prototype = new Animal(); // Animalを関連付け
var ham1 = new Hamster();
ham1.walk(); // 「トコトコ」 ［A］
Hamster.prototype = new SuperAnimal (); // SuperAnimalを関連付け
var ham2 = new Hamster();
ham2.walk(); // 「ダーッ！」 ［B］
ham1.walk(); // ？？？ ［C］
----------------------------
◆オブジェクトと連想配列
//・JavaScriptではオブジェクトと連想配列との間に厳密な区別はない
//・JavaScriptの世界においては同一の概念
var obj = new Object();
obj.x=1;
obj.x=2;
↑
↓
var obj = {x:1,y:2};
obj.x
↑
↓
obj["x"]
//・オブジェクト配下のメンバを列挙できる(prototypeは除く)
//・prototypeプロパティがDontEnum属性でマーキングされている
//・DontEnum属性が付与されたメンバは、for…inループによる
// 列挙の対象から外される
var ary = new Array();
for (name in ary) { window.alert(name); }
