Heim > Web-Frontend > js-Tutorial > Hauptteil

Ausführliche Erläuterung, wie JavaScript das Konstruktormuster zum Erstellen von Objektinstanzen verwendet

伊谢尔伦
Freigeben: 2017-07-27 10:32:15
Original
3300 Leute haben es durchsucht

Konstruktormuster

Konstruktoren wie Object und Array werden zur Laufzeit automatisch in der Ausführungsumgebung angezeigt. Darüber hinaus können Sie benutzerdefinierte Konstruktoren erstellen, um Eigenschaften und Methoden benutzerdefinierter Objekttypen zu definieren.


function Person(name, age, job){
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = function(){
 alert(this.name);
};
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");
Nach dem Login kopieren

In diesem Beispiel ersetzt die Funktion Person() die Funktion createPerson(). Wir haben festgestellt, dass der Code in Person() zusätzlich zu den gleichen Teilen wie createPerson() auch die folgenden Unterschiede aufweist:

1 Das Objekt wird nicht explizit erstellt

2. Die Eigenschaften und Methoden werden diesem Objekt direkt zugewiesen.

3. Es gibt keine Return-Anweisung.

Um eine neue Instanz von Person zu erstellen, müssen Sie den neuen Operator verwenden. Der Aufruf des Konstruktors auf diese Weise durchläuft tatsächlich die folgenden 4 Schritte:

(1) Erstellen Sie ein neues Objekt;
(2) Weisen Sie den Bereich des Konstruktors dem neuen Objekt zu (dies ist also der Punkt). dieses neue Objekt);
(3) Führen Sie den Code im Konstruktor aus (fügen Sie Eigenschaften zu diesem neuen Objekt hinzu);
(4) Geben Sie das neue Objekt zurück.

Am Ende des vorherigen Beispiels enthalten Person1 und Person2 jeweils eine andere Instanz von Person. Beide Objekte verfügen über ein Konstruktorattribut, das auf Person verweist, wie unten gezeigt.

alert(person1.constructor == Person); //true
alert(person2.constructor == Person); //true
Nach dem Login kopieren

Das Konstruktorattribut eines Objekts wird zunächst zur Identifizierung des Objekttyps verwendet. Bei der Erkennung von Objekttypen ist der Instanzoperator jedoch zuverlässiger. Alle Objekte, die wir in diesem Beispiel erstellen, sind sowohl Instanzen von Object als auch Instanzen von Person, was über den Operator „instanceof“ überprüft werden kann.

alert(person1 instanceof Object); //true
alert(person1 instanceof Person); //true
alert(person2 instanceof Object); //true
alert(person2 instanceof Person); //true
Nach dem Login kopieren

Das Erstellen eines benutzerdefinierten Konstruktors bedeutet, dass Sie später Instanzen davon als einen bestimmten Typ identifizieren können. Hier übertrifft das Konstruktormuster das Fabrikmuster. In diesem Beispiel sind person1 und person2 beide Instanzen von Object, da alle Objekte von Object erben.

Probleme mit Konstruktoren

Obwohl das Konstruktormuster einfach zu verwenden ist, ist es nicht ohne Mängel. Das Hauptproblem bei der Verwendung von Konstruktoren besteht darin, dass jede Methode für jede Instanz neu erstellt werden muss.

Funktionen in ECMAScript sind Objekte, daher wird jedes Mal, wenn eine Funktion definiert wird, ein Objekt instanziiert. Aus logischer Sicht kann der Konstruktor zu diesem Zeitpunkt auch so definiert werden.

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayName = new Function("alert(this.name)"); // 与声明函数在逻辑上是等价的
}
Nach dem Login kopieren

Wenn man Konstruktoren aus dieser Perspektive betrachtet, ist es einfacher zu verstehen, dass jede Personeninstanz eine andere Funktionsinstanz enthält (um das Namensattribut anzuzeigen). Um es klar auszudrücken: Das Erstellen einer Funktion auf diese Weise führt zu unterschiedlichen Gültigkeitsbereichsketten und Bezeichnerauflösungen, aber der Mechanismus zum Erstellen neuer Funktionsinstanzen ist immer noch derselbe. Daher sind Funktionen mit demselben Namen auf verschiedenen Instanzen nicht gleich, wie der folgende Code beweisen kann.

alert(person1.sayName == person2.sayName); //false
Nach dem Login kopieren

Es ist jedoch nicht erforderlich, zwei Funktionsinstanzen zu erstellen, um dieselbe Aufgabe auszuführen. Außerdem besteht bei diesem Objekt keine Notwendigkeit, die Funktion vor der Ausführung des Codes an ein bestimmtes Objekt zu binden. Daher können Sie dieses Problem lösen, indem Sie die Funktionsdefinition wie folgt aus dem Konstruktor verschieben.


function Person(name, age, job){
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = sayName;
}
function sayName(){
 alert(this.name);
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung, wie JavaScript das Konstruktormuster zum Erstellen von Objektinstanzen verwendet. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage