• 追加された行はこの色です。
  • 削除された行はこの色です。
* クラス(オブジェクト)の作り方 [#ee1faea0]

** オブジェクトを生成 [#mc80828f]
 var obj = new Object();
 var obj  = new Object();
 obj.name = 'taro';
 obj.say = function () { alert("hello, " + this.name); };
 obj.say  = function () { alert("hello, " + this.name); };

を省略して、オブジェクトリテラルで書くと、
 var obj = { name : "taro", 
            say  : function() { alert("hello, " + this.name); } 

 var obj = {
     name : "taro", 
     say  : function() { alert("hello, " + this.name); } 
 };

** クラスを定義 [#u48ec2eb]
*** 空のコンストラクタ [#ga5b2288]
 var Person = function() {};
***  コンストラクタでメソッドやフィールドを定義[#fc448499]
thisを使ってクラスのプロパティにアクセスする。
 var Person = function(name) {
     this.name = name;
     this.say = function() { alert("hello, " + this.name); };
 };
ただし、この方法はインスタンス生成ごとにメソッドを定義する事になり、メモリ効率が悪い。これを避けるには、プロトタイプによるメソッドやフィールドを定義を行う。

** クラスからインスタンスを生成 [#m5dce2e9]
 var person = new Person("taro");
 person.say();

** クラスにプロトタイプでメソッドやフィールドを定義[#n7668f55]
 Person.prototype = {
     say2: function() {
         alert("hello2, " + this.name);
     }
 };
 person.say2();

*** プロトタイプ汚染 [#pc7c1759]
この方法でArrayのような組込みクラスを拡張する事が可能だが、安易に拡張するとfor inでオブジェクトのプロパティを列挙すると拡張したプロパティ(メソッド)と元のプロパティ(メソッド)が混ざってしまう(プロトタイプ汚染)ので注意が必要。

** クラスの継承 [#w1db1e89]
***親クラス作成 [#ac0cfa4d]
 var Person = function(name) { this.name = name; }; 
 Person.prototype = { say: function() { alert("hello, " + this.name) } };
*** 子クラス作成 [#q7f19729]
 var Man = function(name) { this.name = "Mr." + name; };
***親クラスを継承 [#ae15c212]
 Man.prototype = new Person;
 var m = new Man("taro");
 m.say();

*** プロトタイプチェイン [#efb4d835]
メソッドの検索は次の順で行われる。
- m.say()
- Man.prototype.say()
- Person.prototype.say()
- Object.prototype.say()

親クラスを辿って行き、最終的にObject.prototypeで見つからなければ、終了する。

*** プロトタイプ継承の注意点 [#fbdffe52]
なお、継承のために、
 Man.prototype = new Person;
ではなく、
 Man.prototype = Peroson.prototype;
としてはならない。この場合、ManのprototypeはPersonのprototypeを参照する事になるので、
 Man.prototype.say2 = function () { alert('hello2') };
のようにManにメソッドを追加すると、Personにもメソッドが追加されてしまう。
 var p = new Person();
 p.say2(); // 本来、未定義であるべき

** JavaScriptのクラス(オブジェクト)の問題点 [#e4ecfe17]
- 親クラスのコンストラクタ(メソッド)を呼び出すのが難しい。
- 多重継承が難しい。
これらを解決するには、何らかのライブラリを使うのが妥当。

** Prototype.jsを使って継承 [#q91482f9]
 var Woman = Class.create();                       // クラス定義
 Object.extend(Woman.prototype, Person.prototype); // 継承
 Object.extend(Woman.prototype,{                   // メソッドのオーバーライド
     initialize: function(name) {
                     this.name = "Miss." + name;
                 }
 });
 var w = new Woman("hanako");
 w.say();
** 参考 [#ie9c838e]
:Defining classes and inheritance | http://prototypejs.org/learn/class-inheritance
:A Base Class for JavaScript Inheritance | http://dean.edwards.name/weblog/2006/03/base/
:Simple JavaScript Inheritance | http://ejohn.org/blog/simple-javascript-inheritance/


トップ   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS