ホームページ > 記事 > ウェブフロントエンド > jsの継承関係を反映させる方法
JS はオブジェクト指向の弱い型指定言語であり、継承もその非常に強力な機能の 1 つです。では、JS で継承を実装するにはどうすればよいでしょうか?様子を見ましょう。
次の 2 つの継承メソッドは、js でよく使用されます。
プロトタイプ チェーンの継承 (オブジェクト間)継承)
クラスベースの継承 (コンストラクター間の継承)
js は Java のような真のオブジェクト指向言語ではないため、js はオブジェクトに基づいており、クラスの概念がありません。したがって、継承を実装したい場合は、js のプロトタイプ メカニズムまたは apply メソッドと call メソッドを使用して実現できます。
オブジェクト指向言語では、クラスを使用してカスタム オブジェクトを作成します。ただし、js 内のすべてはオブジェクトなので、カスタム オブジェクトを作成するにはどうすればよいでしょうか?これには、js プロトタイプを使用する必要があります。
プロトタイプは単にテンプレートとして考えることができ、新しく作成されたカスタム オブジェクトはすべてこのテンプレート (プロトタイプ) のコピーです (実際にはコピーではなくコピーです)。ただし、このリンクは非表示です。新しくインスタンス化されたオブジェクト内には、プロトタイプ オブジェクトを指す、非表示の __Proto__ ポインターがあります)。
js は、コンストラクターとプロトタイプを通じてクラスの機能をシミュレートできます。さらに、js クラスの継承の実装もプロトタイプ チェーンに依存します。
プロトタイプ継承とクラス継承
クラス継承では、サブタイプ コンストラクター内でスーパータイプ コンストラクターを呼び出します。
厳密なクラス継承はあまり一般的ではなく、通常は組み合わせて使用されます。
function Super(){ this.colors=["red","blue"]; } function Sub(){ Super.call(this); }
プロトタイプ継承は、既存のオブジェクトを使用して新しいオブジェクトを作成し、サブクラスのプロトタイプをポイントします。親クラスは、親クラスのプロトタイプ チェーンに結合するのと同じです。
プロトタイプ チェーンの継承
サブクラスが親の属性 (メソッドを含む) を継承するようにするためクラス、最初にコンストラクターを定義する必要があります。次に、親クラスの新しいインスタンスをコンストラクターのプロトタイプに割り当てます。コードは次のとおりです:
<script> function Parent(){ this.name = 'mike'; } function Child(){ this.age = 12; } Child.prototype = new Parent();//Child继承Parent,通过原型,形成链条 var test = new Child(); alert(test.age); alert(test.name);//得到被继承的属性 //继续原型链继承 function Brother(){ //brother构造 this.weight = 60; } Brother.prototype = new Child();//继续原型链继承 var brother = new Brother(); alert(brother.name);//继承了Parent和Child,弹出mike alert(brother.age);//弹出12 </script>
上記のプロトタイプ チェーンの継承には、Object という欠落しているリンクがまだ 1 つあります。すべてのコンストラクターは Object から継承します。オブジェクトの継承は自動的に行われるため、手動で継承する必要はありません。
プロトタイプとインスタンスの間の関係を決定する
プロトタイプとインスタンスの間の関係は 2 つの方法で決定できます。演算子のinstanceofとisPrototypeof()メソッド:
alert(brother instanceof Object)//true alert(test instanceof Brother);//false,test 是brother的超类 alert(brother instanceof Child);//true alert(brother instanceof Parent);//true
プロトタイプチェーンに出現したプロトタイプである限り、プロトタイプチェーンから派生したインスタンスのプロトタイプと言えます。 isPrototypeof() メソッドも true を返します。
関連する学習に関する推奨事項: js ビデオ チュートリアル
以上がjsの継承関係を反映させる方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。