Javascript_javascript ヒントでカスタム オブジェクトを作成する方法の概要

JavaScript でオブジェクトを作成する方法はたくさんあります。

オブジェクト コンストラクター/オブジェクト リテラル:

デザイン パターンは別として、最も基本的な方法は、最初に Object コンストラクターを呼び出してオブジェクトを作成し、次にそのオブジェクトにプロパティを追加することです。

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

var Student = new Object();
Student.name = "シャオミン";
Student.age = 20;
Student.getName = function () {
アラート(this.name);
}

JavaScript オブジェクト リテラルに慣れている学生は、少なくともより簡潔に見える、より良い記述方法に変更できます。

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

var 学生 = {
名前: "シャオホン"、
年齢: 18 歳、
getName: function () {
アラート(this.name);
}
};

欠点: 上記の方法の欠点は、同じインターフェイスを使用して多数の同様のオブジェクトを作成すると、大量の重複コードが生成されることです。これは簡単に理解できるはずです。通常、関数 (メソッドまたはクラス) はパブリック メソッドを作成するために使用されます。そのため、関数の影はまったくありません。

工場出荷時モード:

ファクトリ パターンは、オブジェクトを作成する特定のプロセスを抽象化します。ブラックボックスのように、関数を呼び出して（工場に入り）、対応するパラメータ（さまざまな原材料）を渡すと、対応するオブジェクト（工場で生産される製品）が出てきます。ファクトリ パターンは、複数の同様のオブジェクトを作成する問題を解決します。

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

関数studentFactory(名前,年齢) {
var Student = new Object();
Student.name = 名前;
Student.age = 年齢;
Student.sayName = function () {
アラート(this.name);
}
帰国生;
}
var p1 =studentFactory("ming", 20);
var p2 =studentFactory("hong", 18);

欠点: ファクトリ パターンにも欠点があります。最大の欠点は、オブジェクトの種類の認識の問題です。オブジェクトの型が Object (p1 instanceof Object) であることだけが判断できますが、具体的にどの型であるかを判断することはできません。ファクトリ パターンを使用して作成されたスチューデントは、実際には同様のプロパティとメソッドを持ちますが、値は異なります。現時点でのより良い解決策は、すべてのオブジェクトが Student タイプに属するように Student 関数を作成することです。つまり、ファクトリー パターンが悪いわけではなく、コンストラクター パターンの方が優れているというだけです。

カスタム型のコンストラクター:

コンストラクターを使用して、特定のタイプのオブジェクトを作成できます。

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

関数 Student(名前,年齢) {
This.name = 名前;
This.age = 年齢;
This.sayName = function () {
アラート(this.name);
}
}
var p3 = 新しい学生("ming", 20);
var p4 = 新しい学生("hong", 18);
アラート(学生の p3 インスタンス); アラート(p3.sayName==p4.sayName); //false

欠点: カスタム コンストラクターの欠点は、各オブジェクトが独自のメソッドを再作成することです。実際、これらのメソッドの機能は同じですが (sayName など)、同じではありません (p3.sayName と p4.sayName)。等しくありません）。

プロトタイプモード:

空の関数を定義し、すべてのプロパティとメソッドをプロトタイプに追加して、すべてのオブジェクトがこれらのプロパティとメソッドを共有するようにします。

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

関数 Student() {};
Student.prototype.name = "ミン";
Student.prototype.age = 20;
Student.prototype.friends = ['qi'];
Student.prototype.sayName = function () {
アラート(this.name);
};

欠点: 一部の属性は共有できず、共有すると問題が発生します。たとえば、友人。各クラスメートの友達のほとんどは異なります。

コンストラクターとプロトタイプの組み合わせ:

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

関数 Student(名前、年齢、友達) {
This.name = 名前;
This.age = 年齢;
This.friends = 友達;
}
Student.prototype = {
コンストラクター: 学生、
sayName: function () {
アラート(this.name);
}
};

概要: コンストラクターとプロトタイプの組み合わせは、カスタム型を作成する方法として広く認識されています。 上記の方法の中で最も優れた方法でもあります。

/************************************************* ************************************************* *********/

実際には、上記のオブジェクトを作成する方法はたくさんありますが、継続的な最適化が必要な特殊なシナリオがいくつかある場合があります。

動的プロトタイプ モード:

コンストラクターとプロトタイプの組み合わせの最適化です。これらの共有プロパティとメソッドについては、初期化されていれば、効率を向上させるために再度初期化する必要はありません。

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

function Student(名前, 年齢) {
This.name = 名前;
This.age = 年齢;
If ((typeof this.sayName) != "関数") {
Student.prototype.sayName = function () {
アラート(this.name);
}
}
}
var stu = new person("ming", 20);
//alert(学生のインスタンス);
stu.sayName();
var stuNew = new person("hong", 18);
//alert(stuNew instanceof Student);
stuNew.sayName();

複数の生徒オブジェクトを作成する場合、sayName メソッドは 1 回だけ初期化されます。

最後に、オブジェクトを作成する非常に便利な方法、つまり安全なコンストラクターがあります。

確実なコンストラクター パターン:

このモードでは、this と new の使用は禁止されており、すべてのオブジェクトはパブリック属性を持ちません。変数の値は読み取りのみ可能であり、変更はできません。

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

////確かなコンストラクターパターン
関数 Student(名前, 年齢) {
var o = new Object();
o.sayName = function () {
アラート(名前);
}
return o;
}
var stu = Student("ming", 21);
stu.sayName();

上記は、JavaScript でカスタム オブジェクトを作成するためのいくつかの一般的な方法をまとめたものです。より良いアイデアがあれば、この記事は継続的に更新されます。