JavaScript: Bahasanya · 4/12
Operator dan type coercion
Kenapa `"5" + 1` jadi "51" tapi `"5" - 1` jadi 4, dan aturan yang membuatnya bisa diprediksi.
Baca 22 menit
Setelah pelajaran ini kamu bisa
- Memprediksi hasil `+` untuk dua value apa pun
- Selalu memilih `===` daripada `==`, dan menjelaskan alasannya
- Menyebutkan value falsy dari hafalan
- Memilih dengan tepat antara `||` dan `??`
Coercion adalah JavaScript mengubah value dari satu type ke type lain agar sebuah operasi bisa selesai. Ini sumber reputasi terburuk bahasa ini, dan aturannya bisa kamu pelajari dalam sepuluh menit.
Operator + punya dua tugas
+ berarti penjumlahan dan penggabungan string. Aturannya: kalau salah satu sisinya string, ia menggabungkan; kalau tidak, ia menjumlahkan. Semua operator aritmetika lain hanya melakukan matematika, jadi mereka mengubah string jadi number.
Perilaku yang paling sering ditertawakan di bahasa ini, padahal aturannya satu kalimat.
Hasil
Tekan Jalankan untuk melihat hasilnya.
Ini jalan di browser kamu, di dalam sandbox. Apa pun yang kamu tulis di sini tidak bisa merusak situs.
== versus ===
=== membandingkan type dan value, tanpa konversi. == mengonversi dulu, memakai tabel aturan yang tidak ada orang hafal dengan benar. Pakai === selalu. Satu-satunya pengecualian yang diterima adalah value == null, cara singkat memeriksa "null atau undefined".
Hasil
Tekan Jalankan untuk melihat hasilnya.
Ini jalan di browser kamu, di dalam sandbox. Apa pun yang kamu tulis di sini tidak bisa merusak situs.
Truthy dan falsy
Di mana pun boolean diharapkan — sebuah if, sebuah && — value akan dipaksa jadi true atau false. Tepat delapan value bersifat falsy. Sisanya, termasuk [], {}, dan "0", bersifat truthy.
// The complete falsy list — worth memorising:
false
0
-0
0n // bigint zero
"" // empty string
null
undefined
NaNHasil
Tekan Jalankan untuk melihat hasilnya.
Ini jalan di browser kamu, di dalam sandbox. Apa pun yang kamu tulis di sini tidak bisa merusak situs.
|| versus ??
|| memakai nilai cadangan kalau sisi kirinya falsy. ?? memakai cadangan hanya kalau sisi kirinya null atau undefined. Bedanya jadi penting begitu value yang sah adalah 0 atau "".
Bug nyata: pengguna mengatur jumlah notifikasinya jadi 0, lalu kodenya diam-diam mengubahnya kembali jadi 10.
Hasil
Tekan Jalankan untuk melihat hasilnya.
Ini jalan di browser kamu, di dalam sandbox. Apa pun yang kamu tulis di sini tidak bisa merusak situs.
Optional chaining
Hasil
Tekan Jalankan untuk melihat hasilnya.
Ini jalan di browser kamu, di dalam sandbox. Apa pun yang kamu tulis di sini tidak bisa merusak situs.
Tugas praktik
Tulis tebakanmu untuk masing-masing, lalu periksa di runner di atas: [] == false, [] === false, Boolean([]), "" ?? "x", "" || "x", 0 ?? 5, null ?? undefined ?? 1.
Hasil yang diharapkan
true, false, true, "", "x", 0, 1
Cek pemahaman
Pilih jawaban dulu