null dan undefined

Formulir pendaftaran sering menyimpan dua rupa kekosongan. Ada kolom catatan tambahan yang Siti belum sempat isi sama sekali, dan ada kolom email cadangan yang sengaja dikosongkan karena memang tidak punya email kedua. Kedua kekosongan itu bermakna berbeda bagi program: satu berarti “data belum masuk”, yang lain berarti “data memang tidak ada”. JavaScript menyediakan dua nilai berbeda untuk dua makna itu — undefined dan null.

Chapter ini memisahkan keduanya dengan tuntas: dari mana masing-masing muncul, apa maknanya, bagaimana keduanya dibandingkan, dan bagaimana perilakunya ketika terlibat perhitungan. Pembedaan ini bukan formalitas semata — salah membaca kekosongan adalah salah satu sumber bug paling awal yang dijumpai pemula.

undefined: Penanda “Belum Diisi” #

Nilai undefined dipasang oleh engine, bukan oleh kita. Ketika variabel dideklarasikan tanpa assignment, engine otomatis mengisi wadahnya dengan undefined sebagai penanda bahwa nilainya belum ditetapkan:

let catatanTambahan;
console.log(catatanTambahan); // undefined

Output yang Dihasilkan:

undefined

Tidak ada error di sini — wadahnya ada dan sah dibaca, hanya isinya belum ditentukan. Perilaku ini sudah kita singgung sejak chapter Variables; kini wadah kosong itu mendapat nama resminya. Setiap kali program membaca variabel yang belum diisi, undefined inilah yang dikembalikan, dan keberadaannya sering menjadi petunjuk bug: nilai yang seharusnya sudah diisi ternyata belum pernah mendapat assignment.

null: Kosong yang Disengaja #

Nilai null berarti kebalikannya: kekosongan yang diputuskan dengan sengaja oleh penulis kode. null harus di-assign secara eksplisit; engine tidak pernah memasangnya otomatis. Konvensinya, null dipakai ketika sebuah nilai memang harus ada, tetapi saat ini sengaja tidak berisi:

let emailCadangan = "[email protected]";
console.log(emailCadangan); // [email protected]

emailCadangan = null; // Budi menghapus email cadangan dari formulirnya
console.log(emailCadangan); // null

Output yang Dihasilkan:

[email protected]
null

Baris assignment di tengah membawa maksud yang jelas bagi siapa pun yang membaca kode: “nilai email cadangan sengaja dikosongkan”. null adalah jawaban yang disengaja, bukan hasil kelalaian — dan perbedaan maksud inilah yang membuat keduanya layak dipisahkan menjadi dua nilai berbeda.

Membandingkan Keduanya #

Saat keduanya dibandingkan, JavaScript memberi jawaban yang tampak bertentangan, tergantung operator yang dipakai:

Ketegangan antara dua baris pertama adalah alasan kuat untuk membiasakan === sebagai perbandingan bawaan. Operator == menyetarakan null dan undefined karena keduanya memang sejenis secara semantik, tetapi menyatukan dua makna yang berbeda justru menyembunyikan informasi yang berguna saat debugging. Perbedaan penuh == dan === kita urai di section Operators.

Perilaku keduanya juga berbeda ketika terlibat perhitungan: null diperlakukan seperti angka 0, sedangkan undefined tidak punya padanan angka sama sekali:

console.log(null + 25000);      // 25000 — null dihitung sebagai 0
console.log(undefined + 25000); // NaN — tidak ada padanan angka

Output yang Dihasilkan:

25000
NaN

Hasil pertama terasa tidak wajar, dan memang begitulah adanya: engine mengonversi null menjadi 0 di dalam perhitungan, sehingga biaya tambahan yang “kosong” ikut dihitung nol. Hasil kedua justru lebih jujur — perhitungan melibatkan undefined jatuh ke NaN dan memberi tanda bahwa ada data yang belum diisi. Mekanisme konversi otomatis ini kita bedah tuntas di chapter Type Conversion.

Contoh Lengkap: Formulir Pendaftaran #

Berkas berikut menyatukan seluruh materi chapter ini dalam satu skenario formulir: kolom yang belum diisi, kolom yang dikosongkan belakangan, perbandingan, dan perhitungan:

// form-pendaftaran.js
// Membedakan undefined (belum diisi) dan null (sengaja dikosongkan).

// --- undefined: wadah dideklarasikan tanpa nilai ---
let catatanTambahan;
console.log(catatanTambahan); // undefined

// --- null: nilai yang diisi secara sengaja untuk menandai kosong ---
let emailCadangan = "[email protected]";
console.log(emailCadangan); // [email protected]

// Budi menghapus email cadangan dari formulirnya:
emailCadangan = null;
console.log(emailCadangan); // null

// --- Perbandingan: mirip menurut ==, berbeda menurut === ---
console.log(null == undefined);  // true
console.log(null === undefined); // false

// --- Perilaku berbeda dalam perhitungan ---
console.log(null + 25000);      // 25000 — null diperlakukan seperti 0
console.log(undefined + 25000); // NaN — undefined tidak punya padanan angka

Output yang Dihasilkan:

undefined
[email protected]
null
true
false
25000
NaN

Mari kita telaah apa yang terjadi pada baris-baris kode di atas:

1. Baris 5–6 (let catatanTambahan; lalu console.log(...)): variabel dideklarasikan tanpa assignment, sehingga engine memasang undefined sebagai nilai awalnya.
2. Baris 9–10 (let emailCadangan = "[email protected]"; dst.): kolom email cadangan awalnya berisi teks — data yang sah dan siap dipakai.
3. Baris 13–14 (emailCadangan = null; lalu console.log(...)): assignment null menyatakan kekosongan yang disengaja. Maksud baris ini tegas: nilai sebelumnya dihapus dengan sadar.
4. Baris 17–18 (console.log(null == undefined); dst.): == menyetarakannya menjadi true, sedangkan === membedakan tipenya menjadi false. Pasangan keluaran ini adalah inti pembedaan keduanya.
5. Baris 21–22 (console.log(null + 25000); dst.): dalam perhitungan, null berperilaku seperti 0 sehingga hasilnya 25000; undefined jatuh ke NaN dan menandai data yang belum siap dihitung.

Panduan Memilih #

Kapan memakai yang mana? Panduan yang lazim di industri JavaScript:

• Biarkan undefined bekerja sendiri: tidak pernah perlu meng-assign undefined secara manual. Jika sebuah variabel belum punya nilai, cukup deklarasikan tanpa isi.
• Pakai null untuk kekosongan yang disengaja: ketika sebuah nilai harus “dikosongkan dengan sengaja” — misalnya pengguna menghapus data opsional — assign null.
• Periksa dengan ===: untuk membedakan keduanya dalam kode, nilai === null dan nilai === undefined memberi jawaban yang pasti.

Dua nilai kekosongan ini muncul terus-menerus dalam program nyata, dan kini kita mampu membaca maksud di baliknya. Chapter berikutnya memperkenalkan dua tipe yang lebih jarang tetapi penting pada kasus khusus: bigint untuk angka raksasa dan Symbol untuk identifier unik.

// form-pendaftaran.js
// Membedakan undefined (belum diisi) dan null (sengaja dikosongkan).

// --- undefined: wadah dideklarasikan tanpa nilai ---
let catatanTambahan;
console.log(catatanTambahan); // undefined

// --- null: nilai yang diisi secara sengaja untuk menandai kosong ---
let emailCadangan = "[email protected]";
console.log(emailCadangan); // [email protected]

// Budi menghapus email cadangan dari formulirnya:
emailCadangan = null;
console.log(emailCadangan); // null

// --- Perbandingan: mirip menurut ==, berbeda menurut === ---
console.log(null == undefined);  // true
console.log(null === undefined); // false

// --- Perilaku berbeda dalam perhitungan ---
console.log(null + 25000);      // 25000 — null diperlakukan seperti 0
console.log(undefined + 25000); // NaN — undefined tidak punya padanan angka