Detaillierte Erläuterung der Objektfabrikfunktion und des Konstruktors im JavaScript-Entwurfsmuster_Grundkenntnisse

Im Folgenden finden Sie eine ausführliche Texterklärung und Codeanalyse, um Ihnen das Wissen über die Objektfabrikfunktion und den Konstruktor des JavaScript-Entwurfsmusters zu vermitteln.

Übersicht Die Verwendung von Objektliteralen oder das dynamische Hinzufügen neuer Mitglieder zu leeren Objekten ist die einfachste und einfachste Möglichkeit, Objekte zu erstellen. Zusätzlich zu diesen beiden häufig verwendeten Methoden zur Objekterstellung bietet JavaScript jedoch auch andere Methoden zur Objekterstellung. 1).Verwenden Sie die Factory-Funktion, um Objekte zu erstellen. Die Funktion dieser Funktion besteht darin, Objekte zu erstellen und zu konvertieren.

Übersicht

Die Verwendung von Objektliteralen oder das dynamische Hinzufügen neuer Mitglieder zu leeren Objekten ist die einfachste und einfachste Möglichkeit, Objekte zu erstellen.
Zusätzlich zu diesen beiden häufig verwendeten Methoden zur Objekterstellung bietet JavaScript jedoch auch andere Methoden zur Objekterstellung.
1). Erstellen Sie Objekte mit Factory-Funktionen

Wir können eine Funktion schreiben, deren Funktion darin besteht, Objekte zu erstellen, die als „Objektfabrikmethode“ bezeichnet werden kann.

Code kopieren Der Code lautet wie folgt:

//Factory-Funktion
Funktion create Person(name, age, job) {                                  var o = new Object();                             o.name = Name; o.age = Alter; o.job = job; o.sayName = function () {                                          console.info(this.name); 
};       
return o; } //Fabrikfunktion verwenden, um Objekt zu erstellen  
var person1 = createPerson('Zhang San', 29, 'Software Engineer');
var person2 = createPerson('李思', 40, 'Doctor');





2). Objektkonstruktor definieren

a). Der erste Buchstabe des Objektkonstruktors wird groß geschrieben b) Verwenden Sie dieses Schlüsselwort intern, um Mitglieder zum Objekt

hinzuzufügen c) Verwenden Sie das Schlüsselwort new, um den Objektkonstruktor aufzurufen

Code kopieren

Der Code lautet wie folgt: //Objekt-„Konstruktor“-Funktion definieren  Funktion Person(Name, Alter, Beruf) { this.name = name;     this.age = Alter; this.job = job;    

this.sayName = function () {                                              

console.info(this.name); }; 
} //Verwenden Sie new, um den Objektkonstruktor aufzurufen und ein Objekt
zu erstellen var p1 = new Person('Zhang San', 29, 'Software Engineer');
var p2 = new Person('李思', 40, 'Doctor');


Ein „Konstruktor“, der auf normale Weise aufgerufen wird

Der Konstruktor ist eigentlich eine Funktion. Der Unterschied besteht darin, dass beim Aufruf ein „neues“ Schlüsselwort hinzugefügt werden muss. Wenn dieses Schlüsselwort nicht hinzugefügt wird, wird der Aufruf als gewöhnlicher Funktionsaufruf betrachtet.

Code kopieren

Der Code lautet wie folgt:

//Als Konstruktor, der von einer normalen Funktion aufgerufen wird, werden dadurch Attribute hinzugefügt,

//Wird zu den Eigenschaften und Methoden des Fensterobjekts. console.info(window.name);//Zhang San console.info(window.age); //29 console.info(window.job); //Softwareentwickler

Der Objektkonstruktor sieht folgendermaßen aus:




Code kopieren

Der Code lautet wie folgt:

Funktion Person (Name) {

this.name = name; this.say = function () { return „Ich bin“ this.name; }; }

Eigentlich ist es so (Signalisierung):





Code kopieren

Der Code lautet wie folgt:

Funktion Person (Name) {
// var this = {};
this.name = name;
this.say = function () {
return „Ich bin“ this.name;
};
// gib dies zurück;
}

Vom Konstrukteur geleistete Arbeit

1. Erstellen Sie ein neues Objekt
2. Lassen Sie diesen Teil des Konstruktors auf das neu erstellte Objekt
verweisen 3. Führen Sie den Code im Konstruktor aus, der normalerweise die Arbeit des Hinzufügens von Eigenschaften zum neuen Objekt abschließt
4. Geben Sie die neu erstellte Objektreferenz an die Außenwelt zurück.
Der Unterschied zwischen Objektkonstruktor und Objektfabrikmethode

1. Es gibt keinen expliziten Objekterstellungscode im Objektkonstruktor
2. Die Attribute und Methoden, die das neue Objekt haben sollte, werden über diese Referenz hinzugefügt.
3. Im Objektkonstruktor gibt es keine Return-Anweisung
Normalerweise wird der erste Buchstabe des Objektkonstruktors auf Großbuchstaben gesetzt, um ihn von gewöhnlichen Funktionen zu unterscheiden.
Die Konstruktor-Eigenschaft des Objekts

a) Verwenden Sie die Objektfabrikfunktion, um Objekte zu erstellen, und die Konstruktoreigenschaften jedes Objekts beziehen sich auf Object()

Code kopieren Der Code lautet wie folgt:

var person = createPerson('Zhang San', 29, 'Software Engineer');
//Factory-Methode verwenden, um Objekte zu erstellen,

Das Konstruktorattribut bezieht sich auf die Funktion Object()
console.info(person1.constructor === Object);

//wahr

b) Verwenden Sie den Objektkonstruktor, um Objekte zu erstellen, und das Konstruktorattribut jedes Objekts verweist auf diesen Konstruktor

Code kopieren Der Code lautet wie folgt:

var p = new Person('Zhang San', 29, 'Software Engineer');
//Erstelle ein Objekt mit dem Objektkonstruktor
//Das Konstruktorattribut jedes Objekts verweist auf diesen Konstruktor
console.info(p.constructor === Person);
//True Wie vermeide ich das „Vergessen“ von new? Sie können arguments.callee verwenden, um dieses Problem zu lösen
//Verstehe die Rolle von arguments.callee
Funktion TestArgumentsCallee()
{                                                     console.info(this);     
console.info(diese Instanz von TestArgumentsCallee); console.info(diese Instanz von arguments.callee);
};  
TestArgumentsCallee(); //window
//falsch                                                                                //false 
new TestArgumentsCallee();
//TestArgumentsCallee                                                            //WAHR //wahr

Sie können also arguments.callee direkt verwenden

Code kopieren

Der Code lautet wie folgt:

//Vermeide es, neue
zu vergessen Funktion MyObject(value)
{    
if (!(diese Instanz von arguments.callee))

{                                                   //Wenn der Anrufer vergisst, „Neu“ hinzuzufügen, fügen Sie einfach „Neu“ hinzu und rufen Sie erneut an    

neues MyObject(Wert) zurückgeben;  

}       
this.prop = value;
}  
//Testen
var obj1 = new MyObject(100); console.info(obj1.prop);//100
var obj2 = MyObject(200);                 console.info(obj2.prop); //200



Der obige Inhalt ist eine detaillierte Erklärung der Objektfabrikfunktion und des Konstruktors des JavaScript-Entwurfsmusters. Ich hoffe, er gefällt Ihnen.