Heim > Web-Frontend > js-Tutorial > Was ist ein Konstruktor in Javascript? Detaillierte Erläuterung der Verwendung von Konstruktorinstanzen

Was ist ein Konstruktor in Javascript? Detaillierte Erläuterung der Verwendung von Konstruktorinstanzen

伊谢尔伦
Freigeben: 2017-07-25 13:20:39
Original
2211 Leute haben es durchsucht

Was ist ein Konstruktor?

In einigen objektorientierten Sprachen wie Java, C++ und PHP sind Konstruktoren sehr verbreitet. In Javascript ist der Konstruktor zunächst eine gewöhnliche Funktion, die mit dem new-Operator aufgerufen werden kann und ein Objekt eines speziellen Typs generiert.

// "Benjamin" is a constructor
var benjamin = new Benjamin("zuojj", "male");
Nach dem Login kopieren

Im obigen Beispiel ist Benjamin ein Benjamin-Objekt. Wie wird es also instanziiert?

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
var benjamin = new Benjamin("zuojj", "male");
//Outputs: Benjamin{sex: "male",username: "zuojj"}
console.log(benjamin);
Nach dem Login kopieren

Wie wir sehen können, empfängt der „Benjamin“-Konstruktor einfach die übergebenen Parameter und weist sie diesem Objekt zu. Dies liegt daran, dass beim Aufruf des Konstruktors durch den neuen Operator diesem Objekt des Konstruktors das von der neuen Operation zurückgegebene Objekt zugewiesen wird.
Dies bedeutet, dass der obige Code äquivalent ist zu:

benjamin = {
 "username": "zuojj",
 "sex": "male"
}
Nach dem Login kopieren

Warum den Konstruktor verwenden

Warum den Konstruktor verwenden, es gibt mehrere Gründe:
1 . Die Verwendung von Konstruktoren bedeutet, dass alle diese Objekte mit derselben Grundstruktur erstellt werden können
2. Die Verwendung von Konstruktoren bedeutet, dass das „Benjamin“-Objekt eindeutig als Instanz der „Benjamin“-Funktion gekennzeichnet ist

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
var benjamin = new Benjamin("zuojj", "male");
var ben = {
 "username": "zuojj",
 "sex": "male"
}
//Outputs: true
console.log(benjamin instanceof Benjamin);
//Outputs: false
console.log(ben instanceof Benjamin);
Nach dem Login kopieren

3. Die Verwendung von Konstruktoren bedeutet, dass wir öffentliche Methoden für die gemeinsame Nutzung durch mehrere Instanzen definieren können

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
Benjamin.prototype.getName = function() {
 return this.username;
}
var benjamin = new Benjamin("zuojj", "male");
var ben = new Benjamin("lemon", "female");
//Outputs: zuojj
console.log(benjamin.getName());
//Outputs: lemon
console.log(ben.getName());
Nach dem Login kopieren

3. Vorsichtsmaßnahmen

1.neues Schlüsselwort
Vergessen Sie nicht, beim Instanziieren des Konstruktors das neue Schlüsselwort zu verwenden. Wenn das neue Schlüsselwort nicht verwendet wird, zeigt dieses Objekt auf das globale Objekt (Fenster). Browser und global im Knoten). Daher wird beim Definieren eines Konstruktors empfohlen, den ersten Buchstaben des Funktionsnamens groß zu schreiben.
2. Wenn die aufgerufene Funktion keinen expliziten Rückgabeausdruck hat, gibt sie implizit dieses Objekt zurück – also ein neu erstelltes Objekt. Andernfalls wirkt sie sich auf das zurückgegebene Ergebnis aus, jedoch nur, wenn sie ein Objekt zurückgibt 🎜>

function Bar() {
    return 2;
}
var bar = new Bar();
//返回新创建的对象
//Outputs: Bar {} 
console.log(bar);
function Test() {
    this.value = 2;
    return {
        foo: 1
    };
}
var test = new Test();
//返回的对象
//Outputs: Object {foo: 1} 
console.log(test);
Nach dem Login kopieren
Was wir beachten müssen ist:

a) new Bar() gibt ein neu erstelltes Objekt zurück, nicht den Literalwert 2 der Zahl. Daher new Bar().constructor === Bar, aber wenn ein numerisches Objekt zurückgegeben wird, ist das Ergebnis anders;
b) Der hier erhaltene neue Test() ist das von der Funktion zurückgegebene Objekt und nicht new through das neue Schlüsselwort Das erstellte Objekt sieht folgendermaßen aus:

Das obige ist der detaillierte Inhalt vonWas ist ein Konstruktor in Javascript? Detaillierte Erläuterung der Verwendung von Konstruktorinstanzen. 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