Di versi Javascript sebelumnya (ES5) kita biasa menggunakan var untuk mendeklarasikan variable, tapi setelah ES6 dirilis, Kita dapat menggunakan let dan const.
Terus apa perbedaan antara var, let, dan const ? Mari saya jelaskan dibawah.
Var
var biasa digunakan untuk mendeklarasikan variable sebelum Javascript ES6 dirilis. Di scope terluar kita deklarasikan variable a dengan nilai 0, lalu di scope terdalam kita deklarasi ulang variable a dan nilainya akan berubah dari 0 menjadi 1.
Variable b telah dideklarasikan di scope terluar dan nilainya berubah dari 1 menjadi 3. Variable c telah dideklarasikan di scope terdalam dan masih bisa diakses dari scope terluar.
var a = 0;
var b = 1;
if (true) {
var a = 1; // nilainya berubah
var c = 2; // variable baru
b = 3; // nilainya berubah
console.log("a", a); // a = 1
console.log("b", b); // b = 3
console.log("c", c); // c = 2
}
console.log("a", a); // a = 1
console.log("b", b); // b = 3
console.log("c", c); // masih dapat diakses disini (c = 2)
Let
let merupakan bagian dari Javascript ES6. Di scope terluar kita deklarasikan variable a dengan nilai 0, lalu discope terdalam kita coba deklarasi ulang variable a tapi nilai dari variable a di scope terluar tak akan berubah, melainkan variable a baru akan dibuat dan hanya dapat diakses di scope terdalam.
Variable b telah dideklarasikan di scope terluar dan nilainya berubah dari 1 menjadi 3. Variable c telah dideklarasikan di scope terdalam tapi tak dapat diakses dari scope terluar.
let mirip dengan var tapi tak merubah nilai saat dideklarasi ulang, melainkan variable baru akan dibuat untuk scope terkait. Jika dideklarasikan di scope terdalam, maka tak dapat diakses dari scope terluar.
let a = 0;
let b = 1;
if (true) {
let a = 1; // variable baru
let c = 2; // variable baru
b = 3; // nilainya berubah
console.log("a", a); // a = 1
console.log("b", b); // b = 3
console.log("c", c); // c = 2
}
console.log("a", a); // a = 0
console.log("b", b); // b = 3
console.log("c", c); // error (variable belum dideklarasikan)
Const
const merupakan bagian dari Javascript ES6 seperti let, tapi hannya saja nilainya tak dapat diubah. Di scope terluar kita deklarasikan variable a dengan nilai 0, lalu discope terdalam kita coba deklarasi ulang variable a tapi nilai dari variable a di scope terluar tak akan berubah, melainkan variable a baru akan dibuat dan hanya dapat diakses di scope terdalam.
Variable b telah dideklarasikan di scope terluar tapi nilainya tak dapat diubah. Variable c telah dideklarasikan di scope terdalam tapi tak dapat diakses dari scope terluar.
const mirip dengan let tapi nilainya tak dapat diubah.
const a = 0;
const b = 1;
if (true) {
const a = 1; // variable baru
const c = 2; // variable baru
b = 3; // error (konstan tak dapat diubah)
console.log("a", a); // a = 1
console.log("b", b); // b = 1
console.log("c", c); // c = 2
}
console.log("a", a); // a = 0
console.log("b", b); // b = 1
console.log("c", c); // error (variable belum dideklarasikan)
Perbedaan terbesar adalah nilai dari var dan let masih dapat diubah sedangkan const tidak. Sekarang kamu dapat menggunakan let sebagai pengganti var untuk variable yang nilainya dapat diubah di kode barumu.
Kalau begitu bolehkah saya mengganti semua var ke let di kode lama saya ? Ya, kamu bisa menggantinya tapi jangan dilakukan dengan asal. Karena var dan let memiliki cara kerja yang berbeda seperti yang saya bilang sebelumnya.
Saya sendiri lebih sering menggunakan const karena saya jarang butuh variable yang perlu diubah nilainya.