JavaScript応用プログラミング読書メモ(14) js継承機構の実装_javascriptスキル

継承

継承はオブジェクト指向言語の重要な機能です。つまり、あるクラスが別のクラスのメソッドとプロパティを再利用できます。 JavaScript で継承を実装するには、オブジェクト偽装、call()、apply()、プロトタイプ チェーン、ハイブリッド メソッドという 5 つの主な方法があります。

以下に紹介します。

オブジェクトの偽装

原則: コンストラクターは this キーワードを使用して、すべてのプロパティとメソッドに値を割り当てます。コンストラクターは単なる関数であるため、ClassA のコンストラクターを ClassB のメソッドにして呼び出すことができます。 ClassB は、ClassA のコンストラクターで定義されたプロパティとメソッドを受け取ります。

例:

コードをコピー コードは次のとおりです:

関数ClassA(sColor ){
this.color=sColor;
this.sayColor=function(){
alert(this.color)
}

関数ClassB(sColor ,sName){
this.newMethod=ClassA;
this.newMethod(sColor);

this.name=sName; .sayName= function(){
alert(this.name);
}
}


呼び出し:

コードをコピーします コードは次のとおりです。 var objb=new ClassB("blue","Test");

objb.sayColor(); ;//

blueobjb.sayName(); // テスト



注: ここで ClassA への参照を削除する必要があります。削除しないと、後で定義される新しいメソッドと属性によって関連する属性が上書きされます。そしてスーパークラスのメソッド。このようにして多重継承を実現できます。

call() メソッド

オブジェクト偽装メソッドの人気により、第 3 版では 2 つの新しいメソッド call() と apply( が Function オブジェクトに追加されましたECMAScript ) メソッドを使用して同様の機能を実現します。
call() メソッドの最初のパラメータは this のオブジェクトとして使用され、他のパラメータは関数自体に直接渡されます。例:

コードをコピー コードは次のとおりです: function SayColor(sPrefix,sSuffix) {

alert(sPrefix this.color sSuffix);

var obj=new Object();

//
sayColor.call(obj,"色は ","、とても良い色です。");


このメソッドを使用します。継承を実装するには、最初の 3 行の割り当て、呼び出し、削除のコードを置き換えるだけです:

コードをコピー

コードは次のとおりです。次のように: function ClassB(sColor,sName){ //this.newMethod=ClassA; //this.newMethod(sColor); .newMethod;

ClassA.call(this,sColor);

this.sayName=function(){
alert(this.name); >}
}




apply() メソッド


apply() メソッドは call() メソッドと似ていますが、次の点が異なります。 2 番目のパラメータは apply( ) メソッド内にあり、配列が渡されます。

コードをコピー

コードは次のとおりです。

function SayColor(sPrefix,sSuffix){ alert (sPrefix this.color sSuffix); } var obj=new Object();

//出力色は赤です。確かにとてもいい色です。

sayColor.apply(obj,new Array("色は ","、とてもいい色です。"));このメソッドを継承するには、最初の 3 行の割り当て、呼び出し、削除のコードを置き換えるだけです:




コードをコピー


コードは次のとおりです。

function ClassB(sColor,sName){
//this.newMethod=ClassA;
//this.newMethod(sColor); 🎜>//delete this.newMethod;

ClassA.apply(this,new Array(sColor)); this.sayName=function(){ alert(this.name); } }

call() との違いの 1 つは、スーパークラスのパラメーターの順序がサブクラスのパラメーターの順序とまったく同じである場合、引数を 2 番目のパラメーターとして使用できることです。

プロトタイプ チェーン

この形式の継承は、もともと ECMAScript のプロトタイプ チェーンに使用されていました。 Prototype オブジェクトのプロパティとメソッドはすべて、そのクラスのすべてのインスタンスに渡されます。プロトタイプ チェーンはこの機能を利用して継承メカニズムを実装します。

プロトタイプ チェーンを使用して継承を実装する例:

コードをコピー コードは次のとおりです:

function ClassA(){
}

ClassA.prototype.color="red";
ClassA.prototype.sayColor=function(){
alert(this .color);
};

関数 ClassB(){
}

ClassB.prototype=new ClassA(); ClassA のコンストラクターを呼び出します。パラメーターは渡されません。プロトタイプ チェーンでは、コンストラクターにパラメーターがないことを確認するのが標準的な方法です。

ハイブリッドメソッド

このメソッドは、オブジェクト偽装とプロトタイプチェーンメソッドを組み合わせたものです。例:

コードをコピー コードは次のとおりです。 function ClassA(sColor){

this .color=sColor;

}
ClassA.prototype.sayColor=function(){
alert(this.color)
}

function ClassB(sColor, sName){
ClassA.call(this,sColor);
this.name=sName;

ClassB.prototype=new ClassA(); SayName=function (){
alert(this.name);
}


呼び出し例:

コードをコピー

コードは次のとおりです: var objb=new ClassB("red","test"); objb.sayColor();// 出力red objb.sayName();// 出力テスト

作者: Artwl