Memahami Perbedaan Const, Let, dan Var dalam JavaScript

Perbedaan const let dan var sering membingungkan pemula yang belajar JavaScript, padahal perbedaannya menentukan bug dan gaya kode. Artikel ini menjelaskan perbedaan scoping, hoisting, kemampuan reassign, dan perilaku pada objek, disertai contoh singkat dan aturan praktis. Tujuannya supaya kamu bisa memilih keyword yang tepat saat menulis atau mereview kode.

Kapan harus menggunakan const, let, dan var?

Perbedaan const, let, dan var itu sedeharna. Gunakan const bila binding tidak akan diganti, pakai let saat nilai perlu berubah, dan hindari var kecuali bekerja dengan kode lama. Saya tahu keputusan ini terasa sepele tapi berpengaruh pada bug dan keterbacaan—kita akan bahas situasi nyata. Sekarang kita mulai dari perbedaan dasar sehingga kamu paham alasan di balik aturan penggunaan.

Perbedaan Const, Let, dan Var

Const dipakai untuk nilai yang tidak boleh di-reassign, let untuk nilai yang bisa berubah, dan var adalah cara lama yang membawa perilaku function scope dan hoisting yang membingungkan. Ketiganya di-hoist, tetapi let dan const berada dalam temporal dead zone sampai baris deklarasi.

// const: tidak bisa reassign atau redeclare

const pi = 3.14;

pi = 3.15; // TypeError

const pi = 3; // SyntaxError

// let: bisa reassign, tidak bisa redeclare dalam scope sama

let count = 1;

count = 2; // OK

let count = 3; // SyntaxError

// var: bisa reassign dan redeclare (berisiko)

var name = 'A';

var name = 'B'; // OK, nilai awal tertimpa

Perbedaan utamanya:

💻 Mulai Belajar Pemrograman

Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.

Daftar Sekarang

Scope: let dan const itu block-scoped, var itu function-scoped.
Hoisting: var terisi undefined saat di-hoist, let/const memicu ReferenceError sebelum deklarasi.
Reassign: let dan var boleh di-reassign, const tidak.
Redeclare: var boleh di-redeclare dalam scope sama, let/const tidak.

Scoping dan Hoisting yang Memengaruhi Pilihan Variabel

let dan const punya block scope, sedangkan var punya function scope. Artinya, variabel let/const hanya hidup di dalam block seperti if atau for. Sementara var akan “bocor” ke seluruh fungsi.

function test() {

if (true) {

var a = 1;

let b = 2;

}

console.log(a); // 1

console.log(b); // ReferenceError

}

Hoisting membuat deklarasi var diangkat ke atas fungsi, dengan nilai awal undefined. Pada let dan const, nama variabel juga di-hoist, tetapi masuk ke Temporal Dead Zone sampai baris deklarasi. Jika kamu akses sebelum deklarasi, akan muncul ReferenceError, bukan sekadar undefined.

console.log(x); // undefined

var x = 10;

console.log(y); // ReferenceError (TDZ)

let y = 20;

Saat debugging, cek dulu lokasi deklarasi dibanding titik pemakaian variabel. Tambahkan console.log dekat deklarasi untuk memastikan nilai dan scope-nya. Jika perilaku terasa aneh, curigai var yang ter-hoist atau block scope yang membatasi akses variabel.

Mutability Reassign dan Redeclare Praktis untuk Developer

Const mengunci binding, bukan isi nilai. Artinya kamu tidak bisa reassign variabelnya, tetapi isi objek atau array masih bisa diubah.

const user = { name: 'Ana' };

user.name = 'Budi'; // valid

user = {}; // TypeError: Assignment to constant variable.

Hal yang sama berlaku untuk array, elemen boleh diubah, tetapi referensi variabelnya tidak.

const list = [1, 2];

list.push(3); // valid

list = [1, 2, 3]; // TypeError: Assignment to constant variable.

let boleh reassign di scope yang sama, tetapi tidak boleh redeclare di block yang sama. var boleh dua-duanya, sehingga mudah tanpa sengaja menimpa nama variabel.

let a = 1;

a = 2; // ok

let a = 3; // SyntaxError: Identifier 'a' has already been declared

var b = 1;

var b = 2; // ok, tapi berisiko menimpa

Kalau butuh benar-benar immutable, gunakan Object.freeze() atau pola copy dengan spread.

const user2 = Object.freeze({ name: 'Ana' });

// user2.name = 'Budi'; // diabaikan atau error (strict mode)

const updated = { ...user2, name: 'Budi' };

Di proyek besar, banyak tim memakai immutability library seperti Immer untuk mengelola perubahan data kompleks tanpa efek samping tersembunyi.

Kapan Menggunakan Setiap Keyword dalam Proyek JavaScript

Aturan praktisnya sederhana: pakai const sebagai default, pakai let hanya saat nilai perlu di-reassign, dan hindari var kecuali untuk interoperabilitas kode lama. Ini selaras dengan aturan ESLint seperti prefer-const yang otomatis menyarankan const ketika variabel tidak berubah. Dengan cara ini, kamu meminimalkan bug dari reassign tak sengaja dan scope yang membingungkan.

Untuk loop, gunakan let ketika indeks berubah, dan const untuk nilai yang tetap di dalam setiap iterasi.

for (let i = 0; i < users.length; i++) {

const user = users[i];

processUser(user);

}

Closure modern di dalam loop juga aman dengan let, karena setiap iterasi punya binding sendiri, tidak seperti var yang berbagi satu nilai.

Dalam modul, ekspor nilai konfigurasi dengan const, dan pakai let untuk state lokal yang memang berubah. Banyak tim mengaktifkan aturan ESLint seperti no-var, prefer-const, dan no-redeclare untuk menjaga gaya kode konsisten. Ini membantu saat code review, karena reviewer bisa fokus ke logika, bukan ke gaya deklarasi variabel.

Checklist singkat untuk code review dan migrasi:

Cek: apakah variabel pernah di-reassign? Jika tidak, ubah ke const.
Jika perlu berubah, pastikan pakai let, bukan var.
Ganti var ke let/const per modul, lalu jalankan lint dan tes.
Perhatikan scope function vs block saat migrasi dari var.

Penutup

Setelah membaca, kamu harus memahami perbedaan const let dan var, serta mengetahui alasan kenapa const jadi pilihan default modern. Ingat: const bukan berarti immutable untuk objek, dan var membawa hoisting serta scoping yang berisiko. Gunakan aturan praktis yang diberikan untuk menulis kode lebih aman dan mudah dirawat.