Edited at

javascriptのプロトタイプオブジェクトについて

More than 1 year has passed since last update.


Javascriptのプロトタイプオブジェクトについて調べてみた。

※ご指摘により、色々勘違いしていることがわかりました。

近々きちんと修正したいと思います。


プロトタイプとは?

まず、javascriptはプロトタイプベースオブジェクト指向言語です

プロトタイプベースオブジェクト指向言語とは、どのオブジェクトもクラスという雛形に属しているクラスベースオブジェクト指向(javaとかrubyとか)とは異なり、オブジェクトは別のオブジェクトをベース(プロトタイプ)にして独自の特徴を追加していく方式の言語のことです。

プロトタイプとはこの方式の中のベースになるオブジェクトのことを言います。


まずオブジェクトを作っていきます(ES6)

class Animal {

constructor(name, type) {
this._name = name;
this._type = type;
}
}

const cat = new Animal("cat", "mammals");

javascriptのclassは単なる関数のシンタックスシュガーなので

ここでクラスanimalは関数オブジェクトです

次の行

const cat = new Animal("cat", "mammals");

でプロパティprotoにAnimalのプロトタイプオブジェクトを継承します。

console.log(cat.prototype)でcatのprototypeを参照できます

確認して見てください。


暗黙の参照

上で作成したオブジェクトについてもう少し考えてみます

プロトタイプベースオブジェクト指向の言語ではオブジェクトは別のオブジェクトをベース(プロトタイプ)に出来ていると考えます。

それを実現するためにjavascriptでは暗黙の参照という形で実現しています。

例えば次のようなコードがあったとしましょう

class Animal {

constructor() {
}
}

Animal.prototype.hoge = "hoge";

const cat = new Animal("cat", "mammals");
console.log(cat.hoge); //"hoge"

このコードではオブジェクトAnimalをプロトタイプとしたcatというオブジェクトが作られています。

catはhogeと言うプロパティを持っていませんが、hogeと出力さます。

これはjavascriptが暗黙の参照を行い、Animalのプロトタイプオブジェクトを暗黙的に参照しているのです。

consoleへの出力は

hoge

となります。


prototypeチェーン

通常、オブジェクトのプロパティにメソッドが見つからない場合、そのプロトタイプを探します(暗黙の参照)。

それでも見つからない場合はそのプロトタイプのプロトタイプを参照します。

最終的に一番上のプロトタイプからも見つからなかった場合はエラーを返します。

連鎖となって暗黙の参照をするのでプロトタイプチェインと呼ばれています。

例以下のコードを考えます

class Animal {

constructor() {
this.zoo = [];
}

addAnimals(animal) {
this.zoo.push(animal);
}
}

class Cat extends Animal {
constructor() {
super();
}

sayCat() {
console.log("う=!にゃー!うー!にゃー!");
}
}

const cat = new Cat();
cat.addAnimals("チョコ");
console.log(cat.zoo);

まず、AnimalとCatというクラスが作られており、

extendsによってCatはAnimalを継承しています。


まとめ

javascriptはあるオブジェクトをベースにして新しくオブジェクトを作る方式のオブジェクト指向言語である。

プロトタイプとはこのベースとなるオブジェクトのことである。

javascriptのオブジェクトは暗黙にプロトタイプのオブジェクトのプロパティを参照することがある。

参考 http://codezine.jp/article/detail/222