3 minutes
Var, Let, and Const. Who the Fuck Are They?
Dimulai dari ES6 kita akan ketemu sama tiga jenis variabel: var, let, const di Javascript. Dengan kelebihannya masing-masing tentunya. Kapan ini harus dipakai?
Menurut Bang Sastra, mudahnya begini:
- gunakan let
- jika nilainya tidak akan berubah (statis), gunakan const
- jangan gunakan var
WHY?
Mungkin di sini mah yang akan jadi head to head nya itu var dan let, karena const-mah enak dengan dunianya sendiri yang tidak berubah :)
Masalahnya ada pada:
- Redeclaration
- Hoisting
- Scope
Mari kita bahas satu per satu,
1. Redeclaration
Perhatikan kode berikut,
var mantan = "brengsek";
var mantan = "sayang";
// nilai mantan berubah
// dari "brengsek" menjadi "sayang"
let mantan = "brengsek";
let mantan = "sayang"; // error
// mantan tidak bisa jadi "sayang"
Nah, untuk menghindari terjadinya duplikasi variabel, maka gunakan let.
2. Hoisting
Hoisting adalah “ngangkat”. Gimana itu teh?
mantan = "brengsek";
var mantan;
// nilai mantan tetap "brengsek"
mantan = "sayang";
let mantan;
// ga masalah juga sih sebenernya mah
// cuman nilai mantan jadi undefined
// tapi mungkin itu masalahnya ya? haha
Jadi, dalam var terjadi hoisting. Seakan-akan var mantan;
diangkat ke atas sebelum mantan = "brengsek";
.
Sedangkan let tetap membiarkan mantan
tetap undefined
, karena let mantan
bernilai undefined
yang berarti tidak ada nilai yang di-assign
3. Scope
Scope adalah wilayah visibility atau accessibility dari suatu variabel.
Dimana,
var adalah function scope
,
let dan const adalah block scope
.
Kita bahas tentang dua scope diatas,
3.1 Function Scope
Ketika kamu membuat variabel di dalam fungsi, variabel itu hanya dapat diakses di dalam fungsi tersebut saja. Kamu gak akan bisa ngakses variabel itu di luar fungsi.
function putus(){
var mantan = "brengsek";
console.log("mantan itu " + mantan);
}
putus(); // mantan itu brengsek
console.log(mantan); // error
Error karena variabel mantan dipanggil di luar fungsi.
Bandingkan dengan kode berikut,
if (true) {
var mantan = "brengsek";
console.log(mantan); // brengsek
}
console.log(mantan); // brengsek
Karena var tidak menganut block scope, maka nilai mantan tetap bisa dipanggil.
3.2 Block Scope
Setiap area yang ada dalam kurung kurawal ({}
) adalah scope.
Sedangkan block scope adalah dimana variabel yang dideklarasikan di dalam sebuah scope, hanya bisa diakses di scope itu saja.
if (true) {
let mantan = "brengsek";
console.log(mantan); // brengsek
}
console.log(mantan); // error
if (true) {
const mantan = "brengsek terus sampai kiamat";
console.log(mantan); // brengsek terus sampai kiamat
}
console.log(mantan);// error.
Error terjadi karena variabel mantan
dipanggil di luar scope.
CONST
Apa iya nilai const
itu statis atau tidak bisa diubah?
const bentukBumi = "bulat";
bentukBumi = "datar"; // error
Bentuk bumi gak akan bisa diubah jadi datar karena merupakan sebuah konstanta. const
itu dari kata constant.
Tetapi, meski veriabelnya itu const
, untuk property dan value dari objek dan array itu bisa dimodifikasi.
const mantan = {nama: "Puteri", alamat: "Ukraina"};
mantan.hobi = "Nangkep belut";
console.log(mantan);
mantan = {nama: "Asep",
alamat: "Paris",
hobi: "Terjun kasur"}; // error
Maka property dari objek mantan
akan ditambahkan hobi
, menjadi: {nama: "Puteri", alamat: "Ukraina", hobi: "Nangkep belut"}
.
Tapi, apabila ingin merubah seluruh nilai dari objek mantan, itu akan menghasilkan error
.
Array pun begitu, kita bisa menambahkan nilai dari array namun tidak bisa merubah semua isi array.
const mantan = ["Tiffany", "Yoona", "Puteri"];
mantan.push("Euis");
console.log(mantan);
mantan = ["Taeyang", "G-Dragon", "Chanyeol"]; // error
Maka, deretan mantan akan ditambahkan Euis
. Tetapi bila kita reassign seluruh isinya, maka akan terjadi error
karena tidak bisa reassign sebuah konstanta.
FURTHER READING
Kalau kamu suka tulisan saya, boleh kok traktir saya kopi. Tinggal klik di sini.