Javascript hadir dengan dukungan asli parameter default dengan ES2015. Bertentangan dengan apa yang mungkin dipikirkan orang, ini bukan sekadar pengganti sintaksis untuk||(operator logika OR).

Javascript sebelum parameter default

Sebelum dukungan asli untuk parameter default, seseorang akan menulis sesuatu seperti ini:

Untuk memahami potongan kode di atas, kita perlu mengingat hal-hal berikut:

  • Benar/Salah: Nilai dalam javascript dapat dikategorikan menjadi "benar" atau "salah". Dengan kata sederhana, Javascript mencoba mengubah variabel menjadi nilai boolean, untuk mengetahui kondisinya (mis. if, for loop).
  • Evaluasi Hubungan Pendek:Ekspresi yang melibatkan || diproses dari kiri ke kanan. Saat memproses dari kiri ke kanan, kompiler cukup pintar untuk tidak memproses item yang tersisa jika menemukan nilai kebenaran. (ref: S Hubungan pendek).

Singkatnya, ini hanyalah gula sintaksis untuk:

Alasan mengapa metode ini begitu lazim adalah karena Anda dapat merangkai beberapa || dan membiarkan hubungan arus pendek menanganinya. Bayangkan menulis hal yang sama dengan pernyataan if.

Sekarang jika variabel evil Anda berupa string kosong '' atau nilai salah apa pun, fungsi di atas akan menganggapnya sebagai darth vader. Hal ini mungkin baik-baik saja dalam sebagian besar kasus, namun dapat menyebabkan bug diam-diam yang ditakuti dalam aplikasi yang lebih melibatkan. Pencarian stack-overflow sederhana untuk mengatasi masalah ini menghasilkan sejumlah solusi hebat dan yang paling elegan adalah parameter default.

Javascript setelah parameter default

Mari kita gunakan contoh filterEvil yang sama dan lihat tampilannya dengan parameter default.

Sekilas terlihat rapi dan ringkas. Namun jangan biarkan penampilannya menipu Anda! ada banyak hal yang terjadi di balik terpal. Tidaklah masuk akal untuk berasumsi bahwa nilai default akan masuk setiap kali evil kosong.

Mari kita lihat beberapa detail penting,

1. Perbedaanantara null dan tidak ditentukan.

Javascript memiliki dua jawaban untuk masalah tidak ada, null dan undefined. ( null menjadi topik kontroversi). Konsensus umum adalah bahwa null merupakan nilai eksplisit yang menyatakan bahwa tidak ada nilai. Pada contoh di bawah, kami mencoba memasukkan null sebagai argumen.

Fungsi filterEvil tidak akan menggantikanevil dengan nilai default bila diberikan dengan nullataunilaipalsu apa pun .

Fungsi filterEvil akan menggantikan jika dan hanya jika evil adalah undefined. Sekarang Anda beruntung, karena Javascript akan secara otomatis menggunakan undefined jika Anda tidak memberikan argumen secara eksplisit:

Hal ini perlu diingat ketika mengerjakan proyek yang sangat bergantung pada null.(Meskipun demikian, saya sangat khawatir dengan pengembang yang menggunakannull/undefinedsecara bergantian )

2. Dievaluasi dari Kiri ke Kanan

Parameter default dievaluasi dari kiri ke kanan. Ini memang membingungkan tetapi merupakan fitur yang sangat kuat. Mari kita lihat sebuah contoh.

Seperti yang Anda lihat, kita dapat menggunakan kembali parameter di sebelah kiri sebagai parameter default untuk sesuatu di sebelah kanan. Perhatikan bahwa respect akan mendapatkan parameter evil dengan pemeriksaan default diterapkan.

3. Memanggil suatu fungsi

Anda juga dapat memanggil fungsi dan menggunakan nilai yang dikembalikan sebagai parameter default. Singkatnya, ini memungkinkan Anda memanggil fungsi reguler dan menghitung parameter default dengan cepat.

4. Dievaluasi pada waktu panggilan

Nah fitur inilah yang paling membingungkan saya. Mari kita lihat sebuah contoh.

Setiap kali Anda memanggil array tanpa argumen, instance baru dari array kosong akan dibuat.

Setiap kali Anda memanggil filterEvil tanpa argumen, instance baru dari array kosong akan dibuat. Sekarang, ini mungkin menjadi masalah jika Anda menyukai selectors dan memoization. Perilaku ini dapat dengan mudah menipu logika ketergantungan Anda dengan berpikir ada sesuatu yang berubah (saya sedang berbicara dengan Anda React). Misalnya, jika Anda menggunakan pemilihan ulang dalam proyek reaksi, komponen Anda dapat diperbarui jika tidak perlu karena reaksi akan dirender ulang dengan setiap instance baru dari array kosong.

Berikut beberapa trik keren:

  • Pemeriksaan Param yang Diperlukan:Anda dapat menggunakan parameter default untuk menerapkanparameter yang diperlukan. Pada contoh di bawah, kami menerapkan evil sebagai prop yang diwajibkan.
  • Param Default yang Dirusak:Anda juga dapat menggunakan param default dalam ekspresi yang dirusak.

Saya harap posting ini membantu Anda dalam memahami parameter default.

Jika Anda merasa artikel ini bermanfaat, beri saya tepuk tangan đź‘Ź.

Hubungi saya di Twitter @kushan2020.