Es gibt bereits einige sehr gute Antworten, aber ich veröffentliche eine neue, um meine Beobachtung zu Fall III unten zu betonen, was passiert, wenn Sie eine explizite return-Anweisung in einer Funktion haben, die Sie gerade new
erstellen. Schauen Sie sich die folgenden Fälle an:
Fall I :
var Foo = function(){
this.A = 1;
this.B = 2;
};
console.log(Foo()); //prints undefined
console.log(window.A); //prints 1
Oben sehen Sie einen einfachen Fall, in dem die anonyme Funktion aufgerufen wird, auf die verwiesen wird Foo
. Wenn Sie diese Funktion aufrufen, wird sie zurückgegeben undefined
. Da es keine explizite return-Anweisung gibt, fügt der JavaScript-Interpreter eine return undefined;
Anweisung am Ende der Funktion zwangsweise ein . Hier ist das Fenster das Aufrufobjekt (kontextbezogen this
), das neu A
und B
Eigenschaften erhält .
Fall II :
var Foo = function(){
this.A = 1;
this.B = 2;
};
var bar = new Foo();
console.log(bar()); //illegal isn't pointing to a function but an object
console.log(bar.A); //prints 1
Hier new
erstellt ein JavaScript-Interpreter, der das Schlüsselwort sieht, ein neues Objekt, das als Aufrufobjekt (kontextbezogen this
) einer anonymen Funktion fungiert, auf die verwiesen wird Foo
. In diesem Fall A
und B
wurden Eigenschaften für das neu erstellte Objekt (anstelle von Fenster - Objekt). Da Sie keine explizite return-Anweisung haben, fügt der JavaScript-Interpreter eine return-Anweisung zwangsweise ein, um das neue Objekt zurückzugeben, das aufgrund der Verwendung des new
Schlüsselworts erstellt wurde.
Fall III :
var Foo = function(){
this.A = 1;
this.B = 2;
return {C:20,D:30};
};
var bar = new Foo();
console.log(bar.C);//prints 20
console.log(bar.A); //prints undefined. bar is not pointing to the object which got created due to new keyword.
Auch hier erstellt der JavaScript-Interpreter, der das new
Schlüsselwort sieht, ein neues Objekt, das als Aufrufobjekt (kontextbezogen this
) einer anonymen Funktion fungiert, auf die verwiesen wird Foo
. Wieder A
und B
werden Eigenschaften für das neu erstellte Objekt. Aber dieses Mal , wenn Sie eine explizite Anweisung return haben , so wird JavaScript - Interpreter nicht alles von selbst tun.
In Fall III ist zu beachten, dass das Objekt, das aufgrund eines new
Schlüsselworts erstellt wurde, von Ihrem Radar verloren gegangen ist. bar
zeigt tatsächlich auf ein völlig anderes Objekt, das nicht das ist, das der JavaScript-Interpreter aufgrund eines new
Schlüsselworts erstellt hat.
Zitiert David Flanagan aus JavaScripit: The Definitive Guide (6. Ausgabe), Kap. 4, Seite 62:
Wenn ein Objekterstellungsausdruck ausgewertet wird, erstellt JavaScript zuerst ein neues leeres Objekt, genau wie das vom Objektinitialisierer {} erstellte. Als Nächstes ruft es die angegebene Funktion mit den angegebenen Argumenten auf und übergibt das neue Objekt als Wert des Schlüsselworts this. Die Funktion kann damit die Eigenschaften des neu erstellten Objekts initialisieren. Funktionen, die zur Verwendung als Konstruktoren geschrieben wurden, geben keinen Wert zurück, und der Wert des Objekterstellungsausdrucks ist das neu erstellte und initialisierte Objekt. Wenn ein Konstruktor einen Objektwert zurückgibt, wird dieser Wert zum Wert des Objekterstellungsausdrucks und das neu erstellte Objekt wird verworfen.
--- Zusätzliche Informationen ---
Die im Code-Snippet der oben genannten Fälle verwendeten Funktionen haben in der JS-Welt folgende spezielle Namen:
Fall I und II - Konstruktorfunktion
Fall III - Werksfunktion. Factory-Funktionen sollten nicht mit new
Schlüsselwörtern verwendet werden, mit denen ich das Konzept im aktuellen Thread erklärt habe.
In diesem Thread können Sie den Unterschied zwischen ihnen nachlesen .