Var, Let dan Const - Apa Perbedaannya?

Ada begitu banyak fitur menarik yang rilis sejak perilisan javascript 2015 atau ES-6, termasuk di dalamnya let dan const yang nyaris menggantikan var seiring berjalannya waktu.

Dari sekian banyak fitur dari perilisan javascript 2015 (ES-6) yang membantu developer dalam mengembangkan sebuah aplikasi, salah satunya tentang deklarasi variabel.

Banyak dari calon javascript developer mungkin bertanya-tanya, apa perbedaan var, let, dan const, apa yang paling bagus dari mereka semua, dan apa yang paling cocok untuk digunakan dalam mengembangkan aplikasi.

Tentu jawaban dari saya adalah gunakan saja sesuai apa yang diperlukan.

Namun, sebelum memutuskan penggunaan var, let, dan const, pastilah kita harus mengetahui apa dan bagaimana karakteristik serta perbedaan mereka.

Var

Sebelum javascript 2015 (ES-6) rilis, kita telah diperkenalkan oleh keyword var untuk mendeklarasikan sebuah variabel.

Scope

Scope yang dimiliki oleh var hanya global scope dan function scope, artinya variabel yang dideklarasikan menggunakan var tidak menjadi private ketika berada di dalam suatu code block (if, for, while, switch, dll.).

Bersama dengan karakteristik yang bisa di deklarasi ulang, ini merupakan kombinasi yang bagus untuk membuat developer benar-benar kewalahan.

Coba kita buktikan di bawah.

var provinsi = "Yogyakarta"

if(true) {
    var provinsi = "Jakarta"
}

console.log(provinsi) /** Jakarta */

Apabila kodebase yang dibuat masih kecil, mungkin itu tidak masalah. Namun, ketika kodebase mulai membesar hingga ratusan bahkan ribuan baris, developer mungkin akan lupa apakah dia pernah mendeklarasikan variabel tersebut.

Sehingga jika variabel di dalam block scope ternyata telah terdeklarasi, itu pasti akan menimbulkan bug atau bahkan error. Karena seharusnya suatu variabel di dalam block scope itu private atau tidak bisa diakses dari luar.

Dapat Dideklarasi Ulang dan Diupdate

Seperti yang telah dijelaskan sebelumnya, menggunakan var artinya variabel dapat diupdate bahkan dideklarasi ulang.

var provinsi = "Yogyakarta"
var provinsi = "Jakarta"
provinsi = "Surabaya"

console.log(provinsi) /** Surabaya */

Hoisting

Hoisting adalah mekanisme dari javascript dimana semua variabel dan function akan dipindahkan ke atas block scopenya sebelum kode mulai di eksekusi.

Seharusnya saat menggunakan variabel sebelum variabel terdeklarasi akan membuat aplikasi menjadi error. Namun, saat kita menggunakan var tidak, karena saat hoisting var akan diinisialisasi dengan value undefined

console.log(provinsi) /** undefined */
var provinsi = "Jakarta"

Let

let hampir mirip dengan var, kecuali dia memiliki beberapa hal yang membuatnya sedikit lebih istimewa.

Scope

Jika var hanya memiliki global scope dan function scope, let merupakan block scope.

Artinya apapun variabel yang dideklarasikan menggunakan let di dalam kurung keriting {}, maka variabel tersebut akan menjadi private atau hanya bisa dibaca dalam lingkup scopenya saja.

let provinsi = "Yogyakarta"

if(true) {
    let provinsi = "Jakarta"
    console.log(provinsi) /** Jakarta */
}

console.log(provinsi) /** Yogyakarta */

Kabar bagus bukan, karena let memberi solusi dari masalah yang ditimbulkan oleh var.

Dapat Diupdate Tapi Tidak Bisa Dideklarasi Ulang

Tidak hanya itu, let berbeda dengan var karena dia bisa mengatasi masalah deklarasi ulang.

let provinsi = "Bandung"
let provinsi = "Jakarta" /** Error karena let tidak bisa di deklarasi ulang */

Namun, let tetap bisa diupdate.

let provinsi = "Bandung"
provinsi = "Jakarta" /** Tidak error :))*/

Hoisting

Ketika var diinisialisasi menjadi undefined saat hoisting, let tidak akan terinisialisasi sama sekali. Jadi hal tersebut akan menyebabkan error ketika kita menggunakan variabel let sebelum dia dideklarasikan.

console.log(provinsi) /** error karena belum terdeklarasi */
let provinsi = "Bandung"

Const

Karakteristiknya sama seperti var, kecuali dia tidak dapat diupdate atau dideklarasi ulang. Karena merupakan constanta, seperti nilai phi yang selamanya 3.14 atau 22/7.

const provinsi = "Jakarta"
const provinsi = "Surabaya" /** Error karena tidak dapat dideklarasi ulang */
provinsi = "Jawa Tengah" /** Error karena tidak dapat diupdate */

Kesimpulan

Global Scope: var

Can Be Redeclared?: var

Can Be Hoisted?: var

Can Be Reassigned?: var, let

Block Scope: let, const

Function Scope: var, let, const

Penutup

Dari semua ini, saya hanya menyarankan kalian untuk

• Menggunakan let dan jauhi var sebisa mungkin.

• Menggunakan const ketika kalian yakin bahwa nilainya tidak akan berubah selama program berjalan