Variabel adalah nama yang menempel pada sebuah nilai sehingga nilai itu dapat dipakai ulang di bagian lain program. JavaScript modern menyediakan dua kata kunci deklarasi, yaitu const untuk nilai yang tidak berubah dan let untuk nilai yang boleh diganti. Topik ini membahas kapan masing-masing dipakai, bagaimana blok kode membatasi jangkauan sebuah variabel, serta alasan kata kunci var yang lama menjadi sejarah. Setelah mekanismenya dipahami, keputusan memilih kata kunci deklarasi menjadi mekanis dan tidak perlu ditebak.
Deklarasi dengan const dan let#
Deklarasi adalah tindakan memperkenalkan sebuah nama beserta nilainya ke program. const dipakai ketika nilainya tidak akan diganti, sedangkan let dipakai ketika nilainya perlu diperbarui sepanjang program berjalan. Keduanya menerima nilai apa pun, dari teks dan angka sampai array dan object. Contoh berikut memakai keduanya dalam satu program kecil.
const nama = "Budi";
let sisaCuti = 12;
sisaCuti = sisaCuti - 3;
console.log(nama, "bersisa cuti", sisaCuti, "hari");Budi bersisa cuti 9 hariBaris sisaCuti = sisaCuti - 3 menghitung nilai baru dari nilai lama, lalu menyimpannya kembali ke variabel yang sama. Operasi semacam ini disebut penugasan ulang dan hanya sah pada variabel let. Nilai nama tidak pernah diganti sampai program berakhir, sehingga deklarasinya memakai const dan JavaScript tidak menampilkan error apa pun. Pembagian peran seperti inilah yang membuat niat penulis kode terbaca langsung dari kata kuncinya.
Kapan const, kapan let#
Aturan praktisnya sederhana, yaitu mulailah dengan const, lalu ganti ke let hanya ketika nilai memang harus berubah. Penghitung langkah, sisa stok, dan nilai hasil akumulasi adalah contoh yang pantas memakai let. Nama orang, tanggal acuan, dan nilai pengali yang tidak berubah pantas memakai const. Kebiasaan ini membuat pembaca kode dapat memercayai bahwa nilai const tidak akan berubah entah di baris berapa.
Aturan di atas bekerja cepat dalam praktik karena umpan baliknya langsung dari runtime, bukan dari tebakan. Kesalahan pemakaian const langsung terlihat, karena program berhenti pada baris penugasan ulangnya dengan pesan TypeError yang jelas, sehingga perbaikannya tinggal mengganti satu kata. Sebaliknya, kebiasaan memakai let untuk semuanya menghapus sinyal itu, sehingga perubahan nilai bisa tersembunyi di baris mana pun. Dua perilaku inilah yang menjadikan const pilihan awal yang paling aman.
Scope blok#
Blok adalah bagian kode yang diapit kurung kurawal, seperti isi if, isi perulangan, atau isi fungsi. Variabel const dan let hidup di dalam blok tempat keduanya dideklarasikan, dan daerah berlaku ini disebut scope, yakni jangkauan tempat sebuah nama dikenali. Di luar bloknya, nama itu tidak dikenal sama sekali. Contoh berikut menunjukkan konsekuensinya secara langsung.
{
const hargaTiket = 25000;
console.log("harga di dalam blok:", hargaTiket);
}
try {
console.log(hargaTiket);
} catch (e) {
console.log("di luar blok:", e.message);
}harga di dalam blok: 25000
di luar blok: hargaTiket is not definedPesan hargaTiket is not defined muncul karena baris yang mencoba membaca hargaTiket berada di luar blok tempat variabel itu dideklarasikan. Sebaliknya, variabel yang dideklarasikan di blok terluar tetap dapat dibaca dari dalam blok mana pun yang berada di bawahnya. Diagram berikut merangkum aturan itu, yaitu blok di dalam boleh membaca variabel blok luarnya, tetapi tidak sebaliknya.
Pembatasan ini terasa merepotkan bagi yang terbiasa menulis semuanya di satu lingkup besar, tetapi justru menjaga variabel tetap saling lepas. Dua blok yang berbeda boleh memakai nama yang sama tanpa saling menimpa, dan variabel sementara di dalam perulangan tidak bocor ke luar. Semakin kecil scope sebuah variabel, semakin sedikit tempat yang perlu diperiksa ketika nilai itu berperilaku aneh. Itulah alasan blok dipilih sebagai batas berlaku bagi const dan let.
var sebagai sejarah#
Sebelum standar ES2015 dirilis pada tahun 2015, satu-satunya kata kunci deklarasi JavaScript adalah var. Kata kunci ini punya dua perilaku yang kini dianggap membingungkan. Pertama, var mengabaikan blok, sehingga variabelnya berlaku di seluruh fungsi tempat deklarasinya ditulis. Kedua, var mengalami hoisting, yaitu pengangkatan deklarasi ke atas fungsi sebelum kode dijalankan, sehingga membaca variabel sebelum baris deklarasinya tidak menghentikan program, melainkan menghasilkan undefined.
function ceritaVar() {
console.log("sebelum deklarasi:", total);
var total = 100;
if (true) {
var label = "di dalam if";
}
console.log("sesudah deklarasi:", total);
console.log("setelah blok if:", label);
}
ceritaVar();sebelum deklarasi: undefined
sesudah deklarasi: 100
setelah blok if: di dalam ifBaris pertama keluaran memperlihatkan konsekuensi hoisting, karena total sudah dikenal sebagai variabel padahal deklarasinya baru muncul tiga baris kemudian, dan nilainya baru terisi undefined. Baris terakhir memperlihatkan var yang lolos dari blok if, sesuatu yang tidak akan terjadi pada const dan let. Kombinasi keduanya menghasilkan bug yang sulit dilacak pada program besar, karena variabel saling menumpuk di scope fungsi. Karena itulah seluruh jalur ini hanya memakai const dan let, sementara var cukup dikenali agar kode lama tetap bisa dibaca.
Penugasan ulang dan mutasi#
const melarang penugasan ulang, yaitu mengganti variabel agar menunjuk ke nilai lain. Yang tidak dilindungi const adalah isi nilai itu sendiri. Array adalah nilai yang isinya dapat diubah, sehingga menambah elemen dengan push() pada array const tetap sah. Kode berikut menunjukkan batas perlindungan const.
const nilai = [7, 8, 9];
nilai.push(10);
console.log("isi array:", nilai);
try {
nilai = [1, 2];
} catch (e) {
console.log("penugasan ulang:", e.message);
}isi array: [ 7, 8, 9, 10 ]
penugasan ulang: Assignment to constant variable.Baris nilai.push(10) mengubah isi array dan berhasil tanpa hambatan, sedangkan nilai = [1, 2] mencoba mengganti isi variabelnya dan langsung ditolak dengan TypeError. Pembedaan ini penting agar const tidak dipahami sebagai perlindungan total. Untuk data yang benar-benar tidak boleh berubah isinya, JavaScript menyediakan Object.freeze(), dan pembahasannya ada pada modul object dan array. Untuk kebutuhan sehari-hari, melarang penugasan ulang saja sudah mencegah sebagian besar kesalahan penggantian nilai.
Ringkasan#
constuntuk nilai tetap danletuntuk nilai yang berubah, denganconstsebagai pilihan awal yang dipertahankan selama bisa.- Scope blok membatasi
constdanletpada kurung kurawal tempat keduanya dideklarasikan, sedangkan nama dari blok luar tetap terbaca dari dalam. varberlaku di seluruh fungsi dan mengalami hoisting, sehingga kini hanya relevan untuk membaca kode lama.constmelarang penugasan ulang, tetapi isi array dan object di dalamnya tetap dapat dimutasi dengan metode sepertipush().
Referensi#
- JavaScript — MDN Web Docs
— Dokumentasi pernyataan
const,let, danvarbeserta aturan scope-nya. - The Modern JavaScript Tutorial — javascript.info
— Bab variabel yang menjelaskan
let,const, danvarsecara berurutan.