Kapan Harus Pakai Let, Const, dan Var? Simak Perbandingan Lengkapnya
Pernahkah kamu merasa bingung saat baru belajar JavaScript dan melihat orang menulis variabel dengan cara yang berbeda-beda? Ada yang pakai var, ada yang suka banget sama let, dan ada juga yang selalu pakai const. Kalau kamu merasa demikian, tenang saja, kamu tidak sendirian. Memahami perbedaan ketiganya bukan cuma soal biar keren, tapi soal menjaga agar aplikasi yang kamu bangun tidak punya bug aneh yang sulit dilacak.
JavaScript adalah bahasa yang dinamis dan terus berkembang. Dulu, kita hanya punya satu cara untuk mendeklarasikan variabel. Namun, sejak kehadiran ES6 (ECMAScript 2015), standar baru diperkenalkan untuk memperbaiki masalah-masalah lama. Di artikel ini, kita akan mengupas tuntas rahasia di balik let, const, dan var agar kamu bisa coding dengan lebih percaya diri.
1. Mengenal Var
Mari kita mulai dari sejarah. Sebelum tahun 2015, var adalah satu-satunya penguasa di JavaScript. Kalau kamu ingin menyimpan data, ya pakai var. Namun, var punya perilaku yang cukup unik dan sering kali bikin pusing developer pemula maupun profesional.
Function Scope
Var memiliki sifat function scoped. Artinya, jika kamu mendeklarasikan var di dalam sebuah fungsi, variabel tersebut hanya bisa diakses di dalam fungsi itu saja. Tapi, kalau kamu mendeklarasikannya di dalam blok seperti if atau for loop, variabel itu masih bisa "bocor" keluar dan diakses dari mana saja selama masih dalam fungsi yang sama.
function contohVar() {
if (true) {
var nama = "Budi";
}
console.log(nama); // Output: Budi (Padahal di dalam blok if!)
}
Hoisting pada Var
Pernah dengar istilah hoisting? Ini adalah perilaku di mana deklarasi variabel diangkat ke atas sebelum kode dijalankan. Dengan var, kamu bisa memanggil variabel bahkan sebelum variabel itu dideklarasikan tanpa membuat programmu error (nilainya akan menjadi undefined).
console.log(usia); // Output: undefined
var usia = 25;
2. Let: Solusi Modern untuk Variabel yang Berubah
Karena perilaku var yang sering bikin bingung, hadirlah let. Let adalah cara modern untuk mendeklarasikan variabel yang nilainya mungkin perlu diubah di kemudian hari. Let jauh lebih disiplin dibandingkan var.
Block Scope
Berbeda dengan var, let menggunakan block scope. Blok adalah apa pun yang berada di dalam kurung kurawal { }. Jadi, kalau kamu bikin variabel pakai let di dalam if atau for, dia tidak akan bocor keluar. Ini sangat membantu mencegah variabel yang tidak sengaja tertimpa.
if (true) {
let hobi = "Coding";
console.log(hobi); // Output: Coding
}
// console.log(hobi); // Error! hobi tidak dikenal di luar blok if
Tidak Ada Redeklarasi
Salah satu fitur keamanan let adalah kamu tidak bisa mendeklarasikan ulang variabel yang sama di scope yang sama. Kalau pakai var, kamu bisa menulis var x = 1; var x = 2; tanpa protes dari sistem. Di let, hal ini akan memicu error, yang sebenarnya bagus untuk mencegah duplikasi nama variabel.
3. Const: Si Kaku yang Sangat Berguna
Kalau kamu punya data yang tidak boleh berubah sama sekali (konstan), maka const adalah sahabat terbaikmu. Nama variabel ini diambil dari kata "Constant".
Keamanan Data
Begitu kamu mengisi nilai ke dalam const, kamu tidak bisa mengubahnya lagi (reassignment). Ini sangat cocok untuk menyimpan URL API, kunci konfigurasi, atau data yang memang dari awal sampai akhir program harus tetap sama.
const PI = 3.14;
// PI = 3.15; // Error! Assignment to constant variable.
Catatan Penting Tentang Objek dan Array
Banyak yang salah sangka bahwa kalau pakai const untuk Object atau Array, isinya tidak bisa diubah. Salah! Kamu tetap bisa mengubah isi properti di dalam objek atau menambah elemen di dalam array. Yang tidak boleh adalah mengganti seluruh variabel tersebut dengan objek atau array baru.
const user = { nama: "Andi" };
user.nama = "Santi"; // Ini BOLEH
// user = { nama: "Roni" }; // Ini TIDAK BOLEH (Error)
4. Perbandingan Let vs Const vs Var
Agar kamu makin paham, mari kita rangkum perbedaannya dalam tabel sederhana berikut:
| Fitur | Var | Let | Const |
|---|---|---|---|
| Scope | Function Scope | Block Scope | Block Scope |
| Hoisting | Ya (Undefined) | Ya (Temporal Dead Zone) | Ya (Temporal Dead Zone) |
| Re-assign | Bisa | Bisa | Tidak Bisa |
| Re-declare | Bisa | Tidak Bisa | Tidak Bisa |
5. Kapan Harus Menggunakan Masing-Masing?
Setelah tahu teorinya, sekarang kita masuk ke bagian praktis. Bagaimana aturan mainnya dalam pekerjaan sehari-hari sebagai developer?
- Gunakan Const secara default: Mulailah setiap variabel dengan
const. Jika ternyata variabel tersebut perlu diubah nilainya (seperti dalam perulangan atau logika bersyarat), barulah ganti kelet. Ini membuat kodemu lebih mudah dibaca karena orang lain tahu mana data yang tetap dan mana yang berubah. - Gunakan Let untuk iterasi: Saat kamu membuat looping (perulangan),
letadalah pilihan wajib. - Hindari Var: Di era JavaScript modern, hampir tidak ada alasan lagi untuk menggunakan
var. Penggunaan var hanya akan membuka celah terjadinya bug yang sulit dideteksi karena sifatnya yang terlalu bebas.
6. Memahami Temporal Dead Zone (TDZ)
Mungkin kamu pernah mendengar istilah keren ini. Temporal Dead Zone adalah kondisi di mana variabel let dan const sebenarnya sudah mengalami hoisting (dikenali oleh sistem), tapi mereka belum bisa diakses sebelum baris deklarasinya tercapai.
Jika kamu mencoba memanggil let sebelum dideklarasikan, kamu akan mendapatkan ReferenceError. Ini sangat bagus karena memaksa kamu untuk menulis kode yang rapi dan terstruktur secara alur waktu.
7. Dampak pada Performa dan Kebersihan Kode
Menggunakan variabel yang tepat bukan cuma soal teknis, tapi juga soal profesionalisme. Bayangkan kamu sedang bekerja dalam tim besar. Jika kamu menggunakan var sembarangan, rekan setimmu mungkin akan kesulitan melacak di mana variabel itu berasal karena scope-nya yang terlalu luas.
Selain itu, menggunakan Const membantu mesin JavaScript (seperti V8 milik Google Chrome) untuk melakukan optimasi karena mesin tahu bahwa nilai tersebut tidak akan pernah berubah. Meskipun perbedaannya kecil, pada aplikasi skala besar, hal ini bisa berdampak pada efisiensi memori.
8. Menghindari Bug Klasik dengan Let
Mari kita lihat masalah klasik pada perulangan yang sering menjebak developer yang masih menggunakan var.
for (var i = 0; i < 3; i++) {
setTimeout(() => {
console.log(i);
}, 1000);
}
// Output yang diharapkan: 0, 1, 2
// Output yang terjadi: 3, 3, 3
Kenapa hasilnya 3 semua? Karena var bersifat function scope dan hanya ada satu "kantong" untuk i yang terus diperbarui. Saat fungsi setTimeout dijalankan setelah 1 detik, nilai i sudah sampai di angka 3.
Sekarang coba pakai let:
for (let j = 0; j < 3; j++) {
setTimeout(() => {
console.log(j);
}, 1000);
}
// Output: 0, 1, 2
Karena let bersifat block scope, setiap putaran loop memiliki variabel j yang berbeda. Inilah alasan kenapa memahami variabel itu krusial!
Kesimpulan
Belajar JavaScript memang penuh kejutan, tapi memahami let, const, dan var adalah fondasi yang tidak boleh kamu lewatkan. Ingat prinsip sederhana ini: Gunakan Const sedapat mungkin, gunakan Let jika perlu, dan lupakan Var.
Dengan menerapkan aturan ini, kamu sudah selangkah lebih maju untuk menjadi developer JavaScript yang handal. Kodemu akan lebih bersih, minim bug, dan mudah dipelihara oleh orang lain.
Sekarang, coba cek lagi proyek coding-an kamu. Masih ada var yang nyelip? Yuk, mulai migrasi ke let dan const sekarang juga!
Semoga artikel ini bermanfaat buat kamu yang sedang mendalami dunia web development. Kalau ada bagian yang masih membingungkan, jangan ragu untuk terus bereksperimen di console browser kamu. Semangat coding!
Komentar