今回は、JSprototype オブジェクトの使い方についてのチュートリアルをお届けします。JSprototype オブジェクトを使用する際の 注意事項 について、実際の事例を見てみましょう。
プロトタイプを通じて複数のインスタンス間でのメソッド共有の問題を解決しました。次に、プロトタイプとプロトタイプ チェーンの詳細を理解します。
function CreateObj(uName) { this.userName = uName; } CreateObj.prototype.showUserName = function(){ return this.userName; } var obj1 = new CreateObj('ghostwu'); var obj2 = new CreateObj('卫庄');
1. 各関数にはプロトタイプ属性 (prototype) があり、上の図の最初の緑色の線に示すように、コンストラクター関数のプロトタイプ オブジェクト (CreateObj.prototype) を指すポインターです。 2. デフォルトでは、すべてのプロトタイプ オブジェクトは自動的にコンストラクター属性を取得します。この属性の機能には、上の図の 2 番目の緑色の線など、プロトタイプ属性を指す関数が含まれています
。 3. すべてのインスタンス (新しいコンストラクターを通じて作成されたプロトタイプ オブジェクト (CreateObj.prototype、上の図は描いていません) など) には、暗黙的なプロトタイプ (
proto) が含まれています。インスタンス、プロトタイプ オブジェクト 上の図の 3 行目と 4 行目に示されているように、obj1 のコンストラクターは CreateObj であり、CreateObj のプロトタイプ オブジェクトは CreateObj.prototype です。したがって、次のようになります。 obj1.proto === CreateObj.prototype //true
obj2.proto === CreateObj.prototype //true
4. 描画プロセス中に、これに値を割り当てる
プロパティとメソッドをコンストラクターに記述します。たとえば、userName はオブジェクトに割り当てられる属性なので、2 つのオブジェクト obj1 と obj2 に描画されます。 userName 属性があります
5. プロトタイプ オブジェクトに記述されたメソッドまたは属性は、CreateObj.prototype.showUserName = function(){
return this.userName;
}
6. オブジェクトがプロパティとメソッドにアクセスするとき、そのアクセス ルールが呼び出されます (近接原則)。ルールは次のとおりです。 インスタンスに属性またはメソッドがある場合は、それらをインスタンスで直接使用します
インスタンスにプロパティまたはメソッドがない場合、インスタンスのプロト ポインターが指すプロトタイプ オブジェクトに沿って検索が続行され、見つからない場合、値は未定義になります。 showUserName メソッドは obj1 と obj2 には存在しないため、プロトに従って CreateObj.prototype プロトタイプ オブジェクトの showUser
Name メソッドを見つけますCreateObj.prototype プロトタイプ オブジェクトの showUserName をコメント アウトすると、obj1.showUserName と obj2.showUserName がエラーを報告します
console.log( obj1.showUserName() ); //ghostwu console.log( obj2.showUserName() ); //卫庄
// CreateObj.prototype.showUserName = function(){ // return this.userName; // }
コンストラクターでこれに showUserName メソッドを追加すると、obj1 と obj2 はこれを直接呼び出します。これら 2 つのメソッドは図のインスタンスに描画されるため、次のようになります。 これで、複数のインスタンスの属性とメソッドをコンストラクターのプロトタイプオブジェクトに記述することで共有する原理が理解できるはずです
プロトタイプチェーンとは何ですか? 前に、すべてのインスタンス (プロトタイプ オブジェクトを含む) には暗黙のプロトタイプ プロトがあると述べましたが、CreateObj.prototype のプロトタイプ オブジェクトは誰を指すのでしょうか?
りーCreateObj.prototype.proto は Object.prototype を指します。これは、合同演算子
(===) テストに合格した後は true になります Object.prototype.proto は NULL を指しています これはプロトタイプ チェーンです。一部のコンストラクターは、暗黙的なプロトタイプを通じてレイヤーごとに連結されています。なぜカスタム オブジェクトが toString、valueOf、およびその他のメソッドを呼び出せるのかがわかります。 すべてのオブジェクトは Object から継承されるためです。この記事のケースを読んだ後は、このメソッドを習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。react-router4.0はリダイレクトと404関数を実装
jsで要素スタイルを設定する手順の詳細な説明以上がJSprototype オブジェクトの使用チュートリアルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。