Heim > Artikel > Web-Frontend > Ausführliche Erläuterung, wie JavaScript den Factory-Modus, den Konstruktormodus und den Prototyp-Modus verwendet, um Objektinstanzen zu erstellen
Obwohl es sehr praktisch ist, ein Objekt mit dem Objektkonstruktor oder mit Objektliteralen zu erstellen, hat diese Methode einen offensichtlichen Nachteil: Die Verwendung einer Schnittstelle zum Erstellen mehrerer Objekte führt zu einer Menge redundantem Code. Um dieses Problem zu lösen, begannen die Menschen daher, die folgenden Methoden für gemeinsame Objekte zu verwenden.
Fabrikmuster
Dieses Muster abstrahiert den spezifischen Prozess der Objekterstellung und verwendet Funktionen, um die Details von Objekten mit bestimmten Schnittstellen zu erstellen
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();
Factory-Modus-Test
Probleme mit der Factory-Methode: Durch die Verwendung des Factory-Modus kann ein Objekt erstellt werden, das alle Informationen enthält, die als unzählige bezeichnet werden können mal Funktion. Obwohl es das Problem der Erstellung mehrerer ähnlicher Objekte löst, löst es nicht das Problem der Objekterkennung (d. h. wie man den Typ eines Objekts erkennt)
Konstruktormuster
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();
Konstruktormustertest
Beachten Sie, dass sich der Konstruktor wie folgt geringfügig vom Fabrikmuster unterscheidet
Konstruktor zuerst Großbuchstaben
hat das Objekt nicht explizit erstellt
hat diesem Objekt die Eigenschaften und Methoden zugewiesen
hatte keine Return-Anweisung
und auf diese Weise Der Aufruf des Konstruktors durchläuft grob mehrere Schritte
Erstellen Sie ein neues Objekt
Weisen Sie den Bereich des Konstruktors diesem Objekt zu (damit dies auf dieses Objekt zeigt)
Führen Sie das aus Code im Konstruktor (d. h. der Prozess des Hinzufügens von Eigenschaften und Methoden zu einem neuen Objekt)
Objekt zurückgeben
Hinweis: Der Konstruktor unterscheidet sich eigentlich nicht wesentlich von einer gewöhnlichen Funktion Nur Der Unterschied liegt in der aufrufenden Methode. Im Folgenden werden verschiedene Aufrufmethoden veranschaulicht.
// 调用方式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的作用域
Probleme mit Konstruktoren: Das Hauptproblem bei der Verwendung von Konstruktoren besteht darin, dass jede Methode nach der Erstellung auf jeder Instanz erneut ausgeführt werden muss Sowohl p1 als auch p2 verfügen über Show-Methoden, sind jedoch keine Instanzen derselben Funktion, da die Funktion auch ein Objekt in js ist. Daher sind ihre Shared-Show-Methoden nicht gleich.
Prototypmuster
Jede Funktion verfügt über ein Prototypattribut, bei dem es sich um einen Zeiger handelt, der auf ein Objekt zeigt. Der Zweck dieses Objekts besteht darin, Eigenschaften und Methoden zu enthalten, die von allen Instanzen eines bestimmten Typs gemeinsam genutzt werden können. Das heißt, das Prototypobjekt
des durch den Aufruf des Konstruktors erstellten Objekts hat den Vorteil, dass alle Instanzen des Objekts seine Attribute gemeinsam nutzen können. Das heißt, es ist nicht erforderlich, die Instanzinformationen im Konstruktor zu definieren
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
Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung, wie JavaScript den Factory-Modus, den Konstruktormodus und den Prototyp-Modus verwendet, um Objektinstanzen zu erstellen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!