JS オブジェクト指向でオブジェクトを作成するいくつかの一般的な方法 (ファクトリ モード、コンストラクター モード、プロトタイプ モード)_JavaScript スキル

前回の記事では、JavaScript オブジェクト指向の基本 について説明しました。JS の構文は非常に柔軟です。簡単なオブジェクト作成用。これらの柔軟性が高すぎる場所は確かに混乱を招くことがあります。そこで、今日は JS でオブジェクトを作成するために一般的に使用されるいくつかのメソッドを整理します。

はしがき

Object コンストラクターまたはオブジェクト リテラルの使用はオブジェクトの作成に非常に便利ですが、この方法には明らかな欠点があります。インターフェイスを使用して複数のオブジェクトを作成すると、冗長なコードが大量に生成されます。したがって、この問題を解決するために、人々は共通のオブジェクトに対して次のような方法を使用し始めました。

工場出荷時モード

このパターンは、オブジェクトを作成する特定のプロセスを抽象化し、関数を使用して特定のインターフェイスを持つオブジェクトの詳細を作成します

 function cPerson(name,sex,age){
 var o = new Object();
 o.name = name;
 o.sex = sex;
 o.age = age;
 o.show = function(){
 console.log(this.name,this.age,this.sex);
 }
 return o;
}
 var p1 = cPerson('谦龙','男','100');
 p1.show();
 var p2 = cPerson('雏田','女','14');
 p2.show();

工場出荷時モードテスト

ファクトリ メソッドの問題点: ファクトリ モードを使用すると、すべての情報を含むオブジェクトが作成される可能性があり、この関数は何度も呼び出すことができます。類似したオブジェクトを複数作成するという問題は解決しますが、オブジェクト認識 (つまり、オブジェクトの種類を知る方法) の問題は解決しません

コンストラクター パターン

function CPerson(name,sex,age) {//注意这里 构造函数首字母大写
 this.name = name;
 this.sex = sex;
 this.age = age;
 this.show = function () {
 console.log(this.name, this.age, this.sex);
 }
}
var p1 = new CPerson('谦龙','男','100');
 p1.show();
var p2 = new CPerson('雏田','女','14');
 p2.show();

コンストラクター パターン テスト

次のように、コンストラクターが工場出荷時のパターンと若干異なることに注意してください

コンストラクターの最初の文字は大文字になります

明示的に作成されたオブジェクトはありません

このオブジェクトにプロパティとメソッドを割り当てます

返品ステートメントはありません

この方法でコンストラクターを呼び出すと、大まかにいくつかの手順を実行します

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

コンストラクターのスコープをこのオブジェクトに割り当てます (つまり、this はこのオブジェクトを指します)

コンストラクター内のコードを実行します (つまり、新しいオブジェクトにプロパティとメソッドを追加するプロセス)

オブジェクトを返す

注: コンストラクターは実際には通常の関数とあまり変わりません。唯一の違いは呼び出しメソッドにあります。 以下は、いくつかの異なる呼び出しメソッドを示しています

 // 调用方式1 new 方式
 var p1 = new CPerson('谦龙','男','100');
 p1.show();//谦龙 100 男
 // 调用方式2 普通函数调用
 CPerson('谦龙','男','100');
 window.show()//谦龙 100 男 注意属性和方法会被设置到window对象上
 // 调用方式3 在另一个对象的作用域中调用
 var obj = new Object();
 CPerson.call(obj,'谦龙','男','100');
 obj.show(); //谦龙 100 男 在obj的作用域

コンストラクターの問題: コンストラクターを使用する場合の主な問題は、p1 と p2 の両方に show メソッドがありますが、function は同じ Function のインスタンスではないためです。 jsのオブジェクト。したがって、共有される表示方法は同等ではありません。

プロトタイプモード

各関数には、オブジェクトを指すポインターであるプロトタイプ属性があります。このオブジェクトの目的は、特定の型のすべてのインスタンスで共有できるプロパティとメソッドを含めることです。つまり、コンストラクター

を呼び出して作成されたオブジェクトのプロトタイプ オブジェクトです。

利点は、オブジェクトのすべてのインスタンスがそのプロパティ メソッドを共有できることです。つまり、コンストラクター

にインスタンス情報を定義する必要はありません。

 function CPerson(){
}
CPerson.prototype.name='谦龙';
CPerson.prototype.sex='男';
CPerson.prototype.age=100;
CPerson.prototype.show=function(){
 console.log(this.name, this.age, this.sex);
}
var p1 = new CPerson();
 p1.show(); //谦龙 100 男
var p2 = new CPerson();
 p2.show();//谦龙 100 男
 console.log(p1.show == p2.show)//true

上記の内容は、js オブジェクト指向でオブジェクトを作成するためのいくつかの一般的な方法 (ファクトリー モード、コンストラクター モード、プロトタイプ モード) に関するものです。気に入っていただければ幸いです。