Wenn Sie ein Objekt von einer Pfeilfunktion zurückgeben, scheint es aufgrund einer Mehrdeutigkeit in der Grammatik erforderlich zu sein, einen zusätzlichen Satz von {}
und ein return
Schlüsselwort zu verwenden.
Das heißt, ich kann nicht schreiben p => {foo: "bar"}
, muss aber schreiben p => { return {foo: "bar"}; }
.
Wenn die Pfeilfunktion etwas anderes als ein Objekt zurückgibt, sind die {}
und return
nicht erforderlich, z p => "foo"
.
p => {foo: "bar"}
kehrt zurück undefined
.
Ein modifizierter p => {"foo": "bar"}
Wurf " SyntaxError
: unerwartetes Token: ' :
'" .
Gibt es etwas Offensichtliches, das mir fehlt?
quelle
p
als Schlüssel für das Objektliteral verwenden möchten, gehen Sie folgendermaßen vor :p => ({ [p]: 'bar' })
. Ohne das[]
wird es entwederundefined
oder buchstäblich der Brief seinp
.Sie fragen sich vielleicht, warum die Syntax gültig ist (aber nicht wie erwartet funktioniert):
Dies liegt an der Beschriftungssyntax von JavaScript :
Wenn Sie also den obigen Code in ES5 transpilieren, sollte er folgendermaßen aussehen:
quelle
Wenn der Körper der Pfeilfunktion in geschweifte Klammern eingeschlossen ist, wird er nicht implizit zurückgegeben. Wickeln Sie das Objekt in Klammern. Es würde ungefähr so aussehen.
Wenn Sie den Körper in Parens einwickeln, kehrt die Funktion zurück
{ foo: 'bar }
.Hoffentlich löst das Ihr Problem. Wenn nicht, habe ich kürzlich einen Artikel über Pfeilfunktionen geschrieben, der dies ausführlicher behandelt. Ich hoffe, Sie finden es nützlich. Javascript-Pfeilfunktionen
quelle
die richtigen Wege
erklären
https://github.com/lydiahallie/javascript-questions/issues/220
https://mariusschulz.com/blog/returning-object-literals-from-arrow-functions-in-javascript
quelle
Problem:
Wenn Sie tun:
Der JavaScript-Interpreter glaubt, dass Sie einen Codeblock mit mehreren Anweisungen öffnen, und in diesem Block müssen Sie eine return-Anweisung explizit erwähnen.
Lösung:
Wenn Ihr Pfeilfunktionsausdruck eine einzelne Anweisung enthält , können Sie die folgende Syntax verwenden:
Wenn Sie jedoch mehrere Anweisungen haben möchten, können Sie die folgende Syntax verwenden:
Im obigen Beispiel öffnet der erste Satz geschweifter Klammern einen Codeblock mit mehreren Anweisungen, und der zweite Satz geschweifter Klammern gilt für dynamische Objekte. Im Codeblock mit mehreren Anweisungen der Pfeilfunktion müssen Sie explizit return-Anweisungen verwenden
Weitere Informationen finden Sie in Mozilla Docs für JS-Pfeilfunktionsausdrücke
quelle
Sie können dies jederzeit überprüfen, um weitere benutzerdefinierte Lösungen zu erhalten:
quelle