Kurze Analyse der Methode zum Erstellen von JavaScript -Objekten

1. Fabrikmodell

 Funktionsperson (Name, Alter) {var p = new Object (); P.Name = Name; P.age = Alter; p.ShowMessage = function () {console.log ("Name:"+this.name+"Alter:"+this.age); } return p;} var p1 = person ("k1", 28); var p2 = person ("k2", 29); console

Der Defekt des Fabrikmuster

2. Konstruktormodus

 Funktionsperson (Name, Alter) {this.name = name; this.age = Alter; this.showMessage = function () {console.log ("name:"+this.name+"älter:"+this.age); }} var p1 = new Person ("K1", 28); var p2 = new Person ("K2", 29); Konsole.log (p1.showmessage == p2.ShowMessage); // false nicht die gleiche Showmessage -Methode Konsole.log (p1.constructor); // [person] console.log (p1 Instanzperson);

Das Konstruktormuster löst das Problem der Objekterkennung, aber die Showmessage -Methode jedes Objekts ist nicht dieselbe Methode (jede Methode wird auf jeder Objektinstanz nachgebildet), was den Overhead erhöht

3. Prototypmodus

 Funktion person () {} Person.Prototype.name = "k"; Person.Prototype.age = 29; Person.Prototype.ShowMessage = Funktion () {console.log ("name:"+this.name+"Alter:"+this.age); Person();p2.showMessage();//name:k age:29console.log(p1.showMessage==p2.showMessage);// true --The reference is the same function console.log(p1.constructor)//[Person] --Object recognition console.log(p1 instanceof Person)//true --Object recognition console.log (person.prototype.isprototypeof (p1)); // trueconsole.log (Object.getPrototypeof (p1) == Person.Prototype); // true

Das Prototypmuster löst das Problem "Jede Methode wird auf jeder Objektinstanz neu geschaffen" und löst auch das Problem der Objekterkennung.

Ein großes Problem im Prototypenmodus ist, dass alle Objekte, Variablen und Funktionen, die unter dem Funktionsprototyp montiert sind, von allen Instanzen der Funktion geteilt werden. Obwohl die Eigenschaften des Prototyps über Instanzen P1 und P2 zugegriffen werden können, kann der Eigenschaftswert nicht geändert werden. Zum Beispiel fügt P1.Name = "K1" nur eine Eigenschaft von name = "k1" in der P1 -Instanz hinzu und ändert sich nicht in Prototype.name. Es ist in Ordnung, wenn es sich um einen Werttyp handelt, aber wenn es sich um einen Referenztyp handelt, wird es Probleme geben. Siehe das folgende Beispiel

 Funktion person () {}; Person.Prototype.age = 10; Person.Prototype.Array = [1,2,3]; var p1 = new Person (); var p2 = new Person (); console.log (p1.Array); // [1,2,3] console.log (p2.Array); //;1,2,3 weibliche P1.Array.push(4);console.log(p1.Array);//[1,2,3,4] console.log(p2.array);//[1,2,3,4]

P1 fügt dem Array einen Wert hinzu, der sich auch in P2 widerspiegelt, da sie alle auf das gleiche Array zeigen

4. Kombinieren Sie den Konstruktormodus und den Prototypenmodus

Dies ist der häufigste Weg, um Objekte zu erstellen und die Vorteile von Konstruktoren und Prototypmustern zu kombinieren

 Funktionsperson (Name, Alter) {this.name = name; this.age = Age;} person.Prototype.showMessage = function () {console.log ("Name:"+this.name+"Alter:"+this.age);}; var p1 = new Person ("k", 30); p1.showessage ();

5. Dynamischer Prototypmodus

Die Hauptlösung ist: Kapituliere aller Informationen im Konstruktor, was eher der Idee von OO entspricht

 Funktionsperson (Name, Alter) {this.name = name; this.age = Alter; if (typeof this.showMessage! }}} var p1 = new Person ("k", 30); p1.showmessage ();

6. Parasitäres Konstruktormuster

 Funktionsperson (Name, Alter) {var o = new Object (); O.Name = Name; O.age = Alter; o.sayname = function () {console.log (this.name); }; return o;} var p1 = new Person ("k", 28); p1.sayname ();

Das parasitäre Konstruktormuster entspricht genau dem Werksmuster, außer dass das neue Schlüsselwort beim Erstellen des Objekts verwendet wird. Das obige Beispiel: var p1 = neue Person ("K", 28).

Seine Hauptfunktion ist: Funktionen in diesem Konstruktor zu erweitern. Zum Beispiel möchte ich einen Array -Typ myarray definieren, der auf einem Array -Array basiert und wie folgt eine eigene Methode hat

 Funktion myarray () {var values = new Array (); values.push.apply (Werte, Argumente); // Die von selbst definierte Methode. }; Rückgabewerte;} var colors = new myArray ("rot", "blau", "grün"); console.log (colors.topipedstring ()); console.log (farbeninstanz von Array);

7. Stabiler Konstruktormodus

Der sichere Konstruktor folgt dem Muster aus dem parasitären Konstruktor -Typ, es gibt jedoch zwei Unterschiede: Eine soll dies nicht verwenden, und der andere soll nicht neu verwendet werden, um den Konstruktor aufzurufen.

 Funktionsperson (Name, Alter) {var o = new Object (); var tempage = Alter; O.Name = Name; O.age = Alter; o.sayname = function () {console.log (name); } o.sayage = function () {console.log (tempage); } return o;} var p1 = person ("k1", 28); p1.sayname (); // k1p1.sayage (); // 28p1.name = "k2"; p1.age = 30; p1.sayname (); // k1p1.sayage (); // 28

Wenn Sie die obige Ausgabe sehen, können Sie verstehen, was ein sicheres Objektmuster ist. Es ist ein Objekt, das mit diesem Modus erstellt wurde. Es gibt keinen anderen Weg, um den während der Initialisierung übergebenen Wert zu ändern. Dies ist eine Person ("K1", 28). Ein solches Objekt ist ein sicheres Objekt. Tatsächlich ist es eine Schließung von JavaScript.

Die obige kurze Analyse der Methode zum Erstellen eines JavaScript -Objekts ist der gesamte Inhalt, den ich mit Ihnen teile. Ich hoffe, Sie können Ihnen eine Referenz geben und ich hoffe, Sie können wulin.com mehr unterstützen.