web-dev-qa-db-ja.com

プロトタイプベースのOOP基本を理解するための簡単なJavaScriptコード

私はしばらくJavaScriptを知っていますが、私はヘビーユーザーではありませんが、Netscapeが私のブラウザだった頃から初めて知っていました。私は主なことをほとんど理解していますが、JavaScriptのOOPへのアプローチは典型的なものであるため、理解するのに問題があります。

これに追加する1つの問題は、物事は複数の方法で行うことができるようです。ここでは、すべての例をテーブルに載せているため、本があまり役に立たないところです。

私が始めるために必要なのは、それを行う唯一の方法です。誰かが可能な最も簡単なコードで私を助けることができれば、プロトタイプのOOPモデルがどのように機能するかを見ることができる例ですか?

役立つために、コードは継承されたオブジェクトを持ち、親のプロパティとその継承されたプロパティと親の関数にアクセスし、親の関数を上書きし、オブジェクトが他の2つのオブジェクトを継承する多重継承のインスタンスを持っている必要があります。

8

オブジェクトを継承するにはどうすればよいですか?

function inherit(o){ // inherit is called Object.create in modern implementations
    var F= function(){};
    F.prototype=o;
    return new F();
}

var parent = {
    name: "Josh",
    print: function(){
       console.log("Hello, "+this.name);
    }
};
parent.print(); // Hello, Josh
var child = inherit(parent);
child.name = "Jeremy";
parent.print(); //Hello, Josh
child.print();  //Hello, Jeremy

どうすれば親の財産を見ることができますか?

console.log(child.__proto__.name); //won't work in IE; also see getPrototypeOf

どうすれば親の機能にアクセスできますか?

Object.getPrototyepeOf(child).print(); // or
child.print.apply(parent) //functions are just objects, and 'this' pointer can point to wherever you want

親の機能をどのように上書きできますか?

child.print = function(){
    console.log("Hi ", this.name);
}

parent.print(); //Hello, Josh
child.print();  //Hi, Jeremy

オブジェクトは2つのオブジェクトをどのように継承できますか?

//in chain?

grandchild = inherit(child);

//otherwise, there's no way.
grandchild.name = "Eddie";
grandchild.print();

こちらもご覧ください:

6
Aadaam

コードを忘れます。最も簡単な説明。

関数コンストラクターはオブジェクトを作成します。 JSでは、関数はそれ自体がプロパティを持つことができるオブジェクトです。すべての関数には、任意のオブジェクトを含むことができるプロトタイププロパティがあります。コンストラクタのプロトタイプをその場で簡単に設定できます。たとえば、配列を台無しにしたい場合は、

Array.prototype = {
    oneTrueMethodToRuleThemAll: function(){
        alert('arrays are now hosed');
    }
}

プロトタイプオブジェクトは、基本的に、持っていないプロパティを参照しようとしたときにインスタンスによってチェックされるフォールバックです。プロトタイプオブジェクトにそのメソッドがない場合、そのコンストラクターのプロトタイプオブジェクトはメソッドについてチェックされます。それは従われる鎖です。

だから、それは本当に継承についてではありません。それは、「ああ、あなたはそれを持っていない、あなたのお母さんはそれをプロトタイプバッグに入れていますか?いいえ?彼女の祖母はどうですか?いいえ?そして、私たちがイブまたはオブジェクトコンストラクタのプロトタイプに到達するまでどうですか?ドルは常に停止する場所です。

したがって、インスタンスがプロトタイプの内容を取得または保持するわけではありません。 JavaScriptがオブジェクトのメソッドを呼び出すときに、不明なメソッドが見つかるかどうかを確認するために、object-> constructor.prototypeチェーンをチェックするフォールバックプロセスがあるだけです。そのため、コンストラクタプロトタイプを変更すると、既存のすべてのインスタンスがそのメソッドを「取得」します。彼らは本当に何も得ません。新しいメソッドを取得するのは、ルックアップ用のオブジェクトのフォールバックセットです。

2
Erik Reppen

陽気な専門家 @ venkat_s は、プロトタイプの継承を把握するためのアナロジーを共有します。

彼のユーモアのサンプルは次のとおりです。「JavaScriptについてのことは、あなたに怒鳴りません。それはあなたの友達です。何かがおかしいときは通知せず、動作を停止します。電話をやめてください」

継承に関しては、彼は続けました、「プロトタイプはオブジェクトにとってバックパックのようなものです。オブジェクトであるJavaScriptのすべてのものについては、バックパックがあり、それにバックパックを置くことができます。すべてのオブジェクトがそれにアクセスできます。」

お役に立てば幸いです。

2
Jack Stone