JavaScript_javascript スキルのクラスの詳細な紹介

JavaScript では、クラスを使用してオブジェクト指向プログラミングを実装できます。ただし、JavaScript のクラスは Java のクラスとは異なり、対応する定義や使用方法も異なります。

JavaScript でのクラスの定義

JavaScript では、同じプロトタイプ オブジェクト (プロトタイプ) から派生したすべてのオブジェクトがクラスを形成します。つまり、JavaScript のクラスは、2 つのオブジェクトが同じプロトタイプを持つ場合、それらはオブジェクトのコレクションに属します。 JavaScript のクラスにはクラス名さえ必要ありません。次のコードを例として挙げます:

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

var p = {x:42};
var a = Object.create(p);
var b = Object.create(p);
console.log(a === b);//false
console.log(Object.getPrototypeOf(a) === Object.getPrototypeOf(b));//true

上記の例では、オブジェクト a と b は同じプロトタイプ オブジェクト (プロトタイプ) p を持っているため、a と b は同じクラスに属し (ただし、このクラスにはクラス名がありません)、プロトタイプから値を継承します。オブジェクト p を 42 属性 x として扱います。

この例からもわかるように、プロトタイプオブジェクトはテンプレートとして機能し、そこから複数のオブジェクトを派生/作成することができます。その状態は、Java 言語のクラスコードと同じです。 . 定義の核心。次の例のプロトタイプ オブジェクトは、クラス コードに似ています:

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

var p = {
INCREMENT_BY : 1,
インクリメント : function(x){
return x this.INCREMENT_BY;
}
}
var a = Object.create(p);
var b = Object.create(p);
console.log(a.increment(7));//8
console.log(b.increment(9));//10

上記の例では、プロトタイプ オブジェクト p は、値 1 のプロパティ (INCREMENT_BY) と、increment という名前の関数を定義します。オブジェクト a と b は、テンプレート p から INCREMENT_BY 関数と increment 関数を取得します。オブジェクト a または b のインクリメント関数を呼び出すと、JavaScript は a または b の INCREMENT_BY 値 (this.INCREMENT_BY) を取得しようとします。INCREMENT_BY は p から取得され、その値はすべて 1 (テンプレートから取得されたもの) であるためです。 Java の静的変数と同様に、すべて同じ変数であるため、上記の例では、INCREMENT_BY 変数に名前を付けるときにすべて大文字が使用されています。

上記の例では、テンプレート p から作成されたすべてのオブジェクト (同じクラスに属するオブジェクト) は、まったく同じプロパティと動作を持ちます。しかし実際には、同じクラスの異なるオブジェクトの場合、クラスによって定義された属性/動作に加えて、いくつかの固有の属性と動作を持つことがよくあります。したがって、プロトタイプ テンプレートをクラスとして使用する必要がある場合は、そこから派生した各オブジェクトをカスタマイズする必要があります。

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

var p = {
INCREMENT_BY : 1,
インクリメント : function(x){
return x this.INCREMENT_BY this.custom_increment_by;
}
}
var a = Object.create(p);
var b = Object.create(p);
a.custom_increment_by = 0;
b.custom_increment_by = 1;
console.log(a.increment(7));//8
console.log(b.increment(9));//11

この例では、テンプレート p から作成されたオブジェクト a と b は、値が必ずしも互いに等しいとは限らない変数custom_increment_byを持ち、それらのincrement()関数の最終結果はcustom_increment_byの値に関連しています。一般に、新しいオブジェクトのカスタマイズは、次のような統一関数で行われることがよくあります:

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

var p = {
INCREMENT_BY : 1,
インクリメント : function(x){
return x this.INCREMENT_BY this.custom_increment_by;
}
}
function getIncrementalClassObject(customIncrementByValue){
var incrementalObj = Object.create(p);
incrementalObj.custom_increment_by =customIncrementByValue;
増分オブジェクトを返します;
}
var a = getIncrementalClassObject(0);
var b = getIncrementalClassObject(1);
console.log(a.increment(7));//8
console.log(b.increment(9));//11

このように、クラスの定義は、プロトタイプ オブジェクト p と getIncrementalClassObject() 関数を通じて完了します。getIncrementalClassObject() 関数を呼び出すことで、プロトタイプ オブジェクトが p であるオブジェクトを取得でき、これらの新しいオブジェクトは呼び出し中に作成できます。 getIncrementalClassObject() 関数をいくつかカスタマイズします。現時点では、この定義されたクラスにはクラス名がないことに注意してください。説明の便宜上、これを Incremental と呼びます。

getIncrementalClassObject() 関数で行われた作業を振り返ると、Incremental クラスから新しいオブジェクトを作成するプロセスが次のとおりであることがわかります。

1. 空のオブジェクトを作成し、そのプロトタイプ オブジェクトを p として定義します。
2. さまざまなパラメータ値に従って、この新しく作成された空のオブジェクトをカスタマイズします。
3. カスタマイズされた新しいオブジェクトを返します。

JavaScript では、Constructor (コンストラクター) を使用することで、クラスの定義と新しいオブジェクトの作成をすばやく完了できます。

JavaScript のコンストラクター

上記の Incremental クラスの例からわかるように、新しいクラスを定義するには、コードの 2 つの部分が必要です。1 つはテンプレートとしてプロトタイプ オブジェクトを作成し、新しいオブジェクトを作成するときに新しいオブジェクトを初期化するカスタム関数を作成することです。クラスは、新しいオブジェクトのプロトタイプ オブジェクトの指定、新しいオブジェクトのカスタマイズ/初期化、新しいオブジェクトを返すという 3 つのプロセスを経ます。 JavaScript では、これはすべて Constructor (コンストラクター) を通じて実行できます。

JavaScript のコンストラクターは、新しいオブジェクトの初期化を担当する関数であり、このコンストラクター関数のプロトタイプは、新しいオブジェクトを作成するためのテンプレートとして使用されます。上記の Incremental クラスを例として、Constructor を使用してコードを書き直すと、次のようになります:

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

関数 Incremental(customIncrementByValue){
This.custom_increment_by =customIncrementByValue;
}
Incremental.prototype = {
INCREMENT_BY : 1,
インクリメント : function(x){
return x this.INCREMENT_BY this.custom_increment_by;
}
}

var a = new Incremental(0);
var b = 新しい増分(1);
console.log(a.increment(7));//8
console.log(b.increment(9));//11

Constructor 関数を使用して new キーワードを通じて新しいオブジェクトを作成するプロセスは、実際には次の段階を経ます:

新しい空のオブジェクトを作成します。

1. このオブジェクトのプロトタイプオブジェクトをコンストラクター関数のプロトタイプ属性にポイントします。
2. このオブジェクトをパラメータとして使用して、コンストラクター関数を実行します。
3. これは、前の getIncrementalClassObject() 関数で行われたのと同じ作業です。

クラス名

コンストラクターを使用してオブジェクトを作成する場合、対応するオブジェクトにも「クラス名」があり、これは、instanceof 演算子の結果から確認できます。

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

console.log(Incremental のインスタンス);//true
console.log(b 増分インスタンス);//true

ただし、instanceof 演算子は、オブジェクトが Incremental コンストラクターによって作成されるかどうかを決定しません。instanceof 演算子は、オブジェクトのプロトタイプ オブジェクトが Incremental.prototype であるかどうかのみを決定します。同じプロトタイプを持つ 2 つのコンストラクターがある場合、instanceof 演算子は、オブジェクトの作成にどのコンストラクターが使用されたかを区別せずに一律に true を返します。

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

function Incremental2(customIncrementByValue){
This.custom_increment_by =customIncrementByValue 3;
}
Incremental2.prototype = Incremental.prototype;
console.log(Incremental2 のインスタンス);//true