Saat mengembalikan objek dari fungsi panah, tampaknya perlu menggunakan set {}
dan return
kata kunci tambahan karena ambiguitas dalam tata bahasa.
Itu berarti saya tidak bisa menulis p => {foo: "bar"}
, tetapi harus menulis p => { return {foo: "bar"}; }
.
Jika fungsi panah mengembalikan apa-apa selain objek, {}
dan return
tidak diperlukan, misalnya: p => "foo"
.
p => {foo: "bar"}
kembali undefined
.
p => {"foo": "bar"}
Lemparan yang dimodifikasi “ SyntaxError
: token tak terduga: ' :
'” .
Apakah ada sesuatu yang jelas saya hilang?
sumber
p
sebagai kunci untuk literal objek, ini adalah bagaimana Anda melakukannya:p => ({ [p]: 'bar' })
. Tanpa[]
, itu akan menjadiundefined
huruf atau harfiahp
.Anda mungkin bertanya-tanya, mengapa sintaksnya valid (tetapi tidak berfungsi seperti yang diharapkan):
Itu karena sintaks label JavaScript :
Jadi jika Anda mengubah kode di atas ke ES5, itu akan terlihat seperti:
sumber
Jika tubuh fungsi panah dibungkus dengan kurung kurawal, itu tidak dikembalikan secara implisit. Bungkus objek dalam tanda kurung. Akan terlihat seperti ini.
Dengan membungkus tubuh dalam parens, fungsi akan kembali
{ foo: 'bar }
.Semoga itu menyelesaikan masalah Anda. Jika tidak, saya baru-baru ini menulis artikel tentang fungsi Panah yang membahasnya secara lebih rinci. Semoga bermanfaat. Fungsi Panah Javascript
sumber
cara yang benar
menjelaskan
https://github.com/lydiahallie/javascript-questions/issues/220
https://mariusschulz.com/blog/returning-object-literals-from-arrow-functions-in-javascript
sumber
Isu:
Ketika Anda melakukannya:
Penerjemah JavaScript berpikir Anda sedang membuka blok kode multi-pernyataan, dan di blok itu, Anda harus secara eksplisit menyebutkan pernyataan kembali.
Larutan:
Jika ekspresi fungsi panah Anda memiliki satu pernyataan , maka Anda dapat menggunakan sintaks berikut:
Tetapi jika Anda ingin memiliki banyak pernyataan maka Anda dapat menggunakan sintaks berikut:
Dalam contoh di atas, set pertama kurung kurawal membuka blok kode multi-pernyataan, dan set kedua kurung kurawal untuk objek dinamis. Dalam blok kode multi-pernyataan fungsi panah, Anda harus secara eksplisit menggunakan pernyataan kembali
Untuk detail lebih lanjut, lihat Mozilla Docs untuk Ekspresi Fungsi JS Arrow
sumber
Anda selalu dapat memeriksa ini untuk solusi kustom lainnya:
sumber