オブジェクトとプロトタイプチェーンまとめ

今更ですが、JavaScriptのオブジェクトとプロトタイプチェーンについて。

オブジェクトはハッシュ

JavaScriptのオブジェクトはハッシュです。ハッシュに関数や変数を追加すると、オブジェクト的に扱えるようになります。

// ハッシュ
var mii = {};

// プロパティを追加
mii.name = "mii";
mii.getName = function(){
  return this.name;
}

// オブジェクトのように扱える。
stdout.innerHTML += mii.getName() + "<br/>";

でもこれだと、関数の定義がめんどいよね。

オブジェクトごとに個別に関数を定義するのは面倒です。また、関数に割くメモリも無駄。なので一個の関数をみんなで共有したい。そこで委譲を使います。関数を共有オブジェクトに定義して、みんながそれに処理を委譲するイメージ。

そして、これをスマートに行うためにプロトタイプチェーンと呼ばれる仕組みがあります。ルールは次の通り。

未定義のプロパティ(関数orフィールド)にアクセスされた場合、「__proto__」に処理が委譲される。
「__proto__」にプロパティがあればそれを返し、なければさらに(__proto__の__proto__に)処理を委譲する。

なので、複数のオブジェクトで「__proto__」を共有し、そこに関数を定義すればそれを共有できることになります。

「proto」を共有するには?

newでオブジェクトを作成するとき、「<関数>.prototype」の値がオブジェクトの「__proto__」に設定されます。なので

コンストラクタとする関数を定義し、
<関数>.prototypeに共有したい関数定義を設定して、
new <コンストラクタ関数>を呼び出してオブジェクトを生成

すると、「__proto__」を共有するオブジェクトが簡単に作成できます。

// コンストラクタ関数
function Kitten( name ) {
  this.name = name;
}
// コンストラクタ関数のプロトタイプを設定
Kitten.prototype = {
  getName: function(){
    return this.name;
  }
}

// new 演算子を利用してコンストラクタ関数を呼び出す。/ Kitten.prototypeの関数が共有される。
var shiro = new Kitten( "shiro" );
var kuro  = new Kitten( "kuro" );

stdout.innerHTML += shiro.getName() + "<br/>";
stdout.innerHTML += kuro.getName() + "<br/>";