JavaScript_オブジェクト指向

JavaScriptのオブジェクト指向とは

JavaScriptはオブジェクト指向言語ですが、いわゆるプロトタイプベースのOOPに近い仕組みとなります。

他のオブジェクト指向プログラミング言語と異なり、JavaScriptには「クラス」が存在しません。


オブジェクトの定義

オブジェクトの生成

JavaScriptでオブジェクトを定義・生成するには、コンストラクタとして関数を定義します。


var Class = function(){
  //プロパティ
  this.prop1 = 'JavaScript';
  this.prop2 = 'object-oriented programming';
}

メソッド

メソッドはprototypeオブジェクトに対して定義します。

クラス内にメソッドを記述するした場合、インスタンス生成毎に各メソッドがコピーされてしまい、メモリが消費されてしまいます。


Class.prototype = {
  method1: function(){
    return this.prop1 + ' ' +this.prop2;
  }
}

オブジェクトのインスタンス化

オブジェクトをインスタンス化する際には、new演算子を使って生成します。


var obj = new Class();
console.log(obj.method1(););

継承

親クラスの定義

親クラスを定義します。


var SuperClass = function(){};
SuperClass.prototype = {
  superMethod: function() { alert('This is super class.'); }
};

継承クラスの定義

親クラスを継承した子クラスを定義します。

継承は「子クラス.prototype = new 親クラス」と定義します。

つまり、prototype に親クラスのオブジェクトを代入することで継承が実現できます。


var SubClass = function(){};
SubClass.prototype = new SuperClass();
SubClass.prototype.subMethod = function(){
  this.superMethod(); // 親クラスのメソッドを呼び出す。
}

インスタンス生成

インスタンスを生成して、親クラスのメソッドを実行します。

JavaScriptでは、「プロトタイプチェーン」というオブジェクトが他のオブジェクトのプロトタイプとなる連鎖の仕組みをもっています。

これにより、サブクラスにメソッドがなければ、スーパークラスのメソッドを実行することを可能にします。


var obj = new SubClass();
obj.subMethod();

プロトタイプチェーンについて

プロトタイプチェーンとは、オブジェクトが他のオブジェクトのプロトタイプとなる連鎖のことです。


JavaScriptではプロトタイプチェーンを実現するための以下のような仕組みがあります。

  • 全ての関数オブジェクトはprototypeという名前のプロパティを持つ。
  • 関数オブジェクトのコンストラクタによって生成されたオブジェクトは、全てprototypeオブジェクトへのリンクを持つ。

プロトタイプチェーンのためのプロパティとして「prototype」と「__proto__」があります。

  • prototype
    • 関数オブジェクトが持つプロパティであり、何らかのオブジェクトを持つ
  • __proto__
    • 上位オブジェクトのprototypeの参照を持つプロパティ

参照を変更すると、以下のような動作になります。


var ClassA= {
  msg: 'This is ClassA.'
};

var ClassB = {
  msg: 'This is ClassB.'
};

var obj = {};

obj.__proto__ = ClassA;
console.log(obj.msg); // This is ClassA.

obj.__proto__ = ClassB;
console.log(obj.msg); // This is ClassB.

関連ページ