Type Coercion — JavaScript

Coba prediksi: "5" == 5 itu hasilnya true atau false di JavaScript? Jawaban: true. Loh, kan tipenya beda? Itu karena JavaScript diam-diam ngubah string "5" jadi

Coba prediksi: "5" == 5 itu hasilnya true atau false di JavaScript? Jawaban: true. Loh, kan tipenya beda? Itu karena JavaScript diam-diam ngubah string "5" jadi number 5 sebelum membandingkan — fenomena yang dipanggil type coercion. Power buat fleksibilitas, tapi sumber bug paling nyebelin di JavaScript. null == undefined true, tapi null == 0 false. [] == false true. 0 == "" true. Aturan-aturan inkonsisten yang bikin developer pusing.

💡 Aturan emas. Pakai === (strict equal), bukan ==. Strict equal cek tipe + nilai sekaligus, gak ada coercion drama. 99% kasus pemakaian, === adalah pilihan benar. Hidup jadi jauh lebih predictable.

"5" == 5    // true  (string diubah jadi number)
"5" === 5   // false (tipe berbeda)

Implicit coercion terjadi otomatis:

"3" + 2     // "32" (number jadi string, digabung)
"3" - 2     // 1    (string jadi number, dikurangi)
true + 1    // 2    (true jadi 1)

Truthy & Falsy — nilai yang dianggap false: 0, "", null, undefined, NaN, false

Semua nilai lainnya dianggap true, termasuk [] dan {}.

<title id="coerce-t">Tabel coercion: hasil == antara berbagai tipe.</title>Coercion: hasil pakai == (bukan ===)"5" == 5true ✓0 == ""true ⚠0 == falsetrue ⚠null == undefinedtruenull == 0false 🤯[] == falsetrue[] == 0true 🤯"0" == falsetrueNaN == NaNfalse ⚠FALSY valuesfalse0 -0 0n"" "" ``nullundefinedNaNSEMUA lain truthy:[] → truthy{} → truthy"0" → truthy"false" → truthy
Pakai === kalau ragu. == punya aturan transitif yang aneh.

🎭 Analogi sehari-hari

Type coercion = ngobrol dengan penerjemah otomatis yang terjemahkan kata sebelum dibandingkan. "5" == 5 = penerjemah ubah "5" jadi 5 lalu cocok. Tapi penerjemahnya kadang aneh — null == 0 false tapi null <= 0 true. Pakai === = "matikan penerjemah, paksa exact match".

Truthy/falsy = lampu indikator: 0, "", null, undefined, NaN, false = mati. Yang lain (termasuk "0", [], {}) = nyala.

⚠️ Jebakan yang sering ditemui:

  • [] == ![] itu true![] jadi false (kosong tetap object truthy, tapi ! bikin false). Lalu [] == false lewat coercion = true.
  • null cuma == ke undefinednull == 0 adalah false, null < 0 adalah false, tapi null <= 0 adalah true. Aturannya tidak konsisten.
  • NaN !== NaN — kalau perlu cek NaN, pakai Number.isNaN(x) atau x !== x.
  • +"" → 0 — unary + coerce string kosong jadi 0. Sumber bug aneh kalau tidak hati-hati.
  • "0" truthy tapi 0 == "0" — string "0" itu truthy (bukan kosong), tapi loose-equal ke 0. Bingung sih, makanya pakai ===.
  • JSON.parse(undefined) crashJSON.stringify(undefined)undefined (bukan string), parse balik lempar error. Cek sebelum parse.

Tips: Selalu gunakan === kecuali kamu benar-benar tahu apa yang kamu lakukan.

TL;DR: JavaScript diam-diam ubah tipe sebelum bandingkan (type coercion). == (loose) trigger coercion → aturan inkonsisten (null == undefined true tapi null == 0 false). Pakai === (strict) — cek tipe + nilai, gak ada drama. Falsy values: false, 0, "", null, undefined, NaN. Semua lain truthy (termasuk [], {}, "0"). + operator: number + string = string concat. - * /: paksa konversi ke number.

Yang akan kamu pelajari