Banyak sekali fitur baru yang keluar di ES2015 (ES6). Salah satu dari fitur yang keluar di ES6 adalah adanya tambahan let dan const, yang mana bisa digunakan untuk mendeklarasikan variabel. Pertanyaan nya adalah, apa yang membuat fitur tersebut berbeda dari var yang dulu sering kita gunakan?

Var

Sebelum kedatangan ES6, deklarasi var diatur. Ada masalah terkait variabel  var ini. Itulah kenapa perlu adanya pendeklarasian baru untuk variabel. Mari pahami lebih dulu apa itu  var sebelum lanjut membahas permasalahan tersebut.

Scope dari var

Pada dasarnya Scope adalah dimana variabel itu akan digunakan. Pendeklarasian var adalah secara global atau secara function/lokal.

Scope global terjadi jika variabel  var di deklarasikan diluar function. Ini artinya variabel yang di deklarasikan dengan  var diluar blok function dapat digunakan di seluruh tempat.

var menjadi  function Scope jika di delarasikan didalam function. Ini berarti var tersedia dan hanya dapat di akses didalam function tersebut.

Untuk memahami lebih jauh, lihat contoh dibawah ini.

    var greeter = "hey hi";
    
    function newFunction() {
        var hello = "hello";
    }

Disini, greeter adalah Scope global karena berada diluar function sementara hello adalah  function Scope. Jadi kita tidak bisa mengakses variabel hello diluar function. Jika seperti ini:

    var tester = "hey hi";
    
    function newFunction() {
        var hello = "hello";
    }
    console.log(hello); // error: hello is not defined

Kita akan mendapatkan error yang diakibatkan oleh hello karena tidak berada diluar function.

variabel var dapat di deklarasikan ulang dan diperbaharui

Ini berarti kita dapat melakukannya di Scope yang sama dan tidak akan eror.

    var greeter = "hey hi";
    var greeter = "say Hello instead";

dan ini juga:

    var greeter = "hey hi";
    greeter = "say Hello instead";

Hoisting var

Hoisting adalah mekanisme JavaScript dimana pendeklarasian variabel dan function naik ke atas Scope nya sebelum kode di eksekusi. Berarti jika kita melakukan ini:

    console.log (greeter);
    var greeter = "say hello"

dapat diartikan seperti ini:

    var greeter;
    console.log(greeter); // greeter is undefined
    greeter = "say hello"

Jadi variabel var di naikkan ke atas Scope nya dan diinisialisasi dengan nilai undefined.

Masalah dengan var

Ada kelemahan didalam var. Saya akan gunakan contoh berikut untuk menjelaskannya:

    var greeter = "hey hi";
    var times = 4;

    if (times > 3) {
        var greeter = "say Hello instead"; 
    }
    
    console.log(greeter) // "say Hello instead"

Jadi, jika times > 3 adalah benar, greeter berubah, ke "say Hello instead". Selagi ini bukan masalah jika kamu memang menginginkan greeter berubah, ini menjadi masalah jika kamu  tidak menyadari bahwa variabel greeter telah ditentukan sebelumnya.

Jika kamu menggunakan greeter di bagian kode mu yang lain, kamu mungkin akan terkejut dengan hasil yang akan kamu dapatkan. Ini akan menjadikan kode mu penuh bug. Inilah sebabnya  let dan const diperlukan.

Let

let sekarang lebih disukai untuk pendeklarasian variabe, datang dengan penyempurnaan terhadap variabel var.

let adalah scope blok

Blok adalah bagian dari kode yang dikelilingi oleh {}. Blok terdapat di  tanda kurung kurawal. Apapun yang berada didalam tanda kurung kurawal adalah blok.

Jadi variabel yang di deklarasikan didalam blok dengan let hanya tersedia untuk dipakai didalam blok tersebut. Saya akan menjelaskannya dengan contoh dibawah ini:

   let greeting = "say Hi";
   let times = 4;

   if (times > 3) {
        let hello = "say Hello instead";
        console.log(hello);// "say Hello instead"
    }
   console.log(hello) // hello is not defined

Kita dapat melihat jika kita menggunakan hello diluar blok nya (tanda kurung kurawal) itu menjadi error. Ini dikarenakan variabel let adalah Scope blok.

let dapat diperbaharui tapi tidak dapat di deklarasikan ulang.

Seperti layaknya var, variabel yang di deklarasikan dengan let dapat diperbaharui didalam scope nya. Tidak seperti var, variabel let tidak dapat di deklarasikan ulang didalam scope nya. Jadi ini akan berhasil:

    let greeting = "say Hi";
    greeting = "say Hello instead";

ini akan error:

    let greeting = "say Hi";
    let greeting = "say Hello instead"; // error: Identifier 'greeting' has already been declared

Namun, jika variabel yang sama dibuat di scope yang berbeda, tidak akan error:

    let greeting = "say Hi";
    if (true) {
        let greeting = "say Hello instead";
        console.log(greeting); // "say Hello instead"
    }
    console.log(greeting); // "say Hi"

Kenapa tidak error? Karena kedua variabel tersebut diperlakukan berbeda karena scope nya pun berbeda

Fakta ini membuat let menjadi pilihan yang lebih baik dibanding var. Jika menggunakan let, kamu tidak perlu pusing menggunakan nama untuk variabel yang digunakan sebelumnya karena variabel nya berada di scope yang berbeda. Dan juga, karena variabel tidak dapat di deklarasikan lebih dari sekali di scope nya.

Hoisting pada let

Seperti layaknya var, pendeklarasian let akan dinaikkan ke atas. Tidak seperti var akan terinisialisasi undefined, let  tidak akan terinisialisasi. Jadi jika kamu coba menggunakan variabel let sebelum di deklarasi, kamu akan mendapatkan Reference Error.

Const

Variabel yang di deklarasikan dengan const akan mempertahankan nilai nya. const hampir mirip dengan let.

const adalah scope blok

Seperti let, const hanya dapat di akses didalam blok dimana variabel tersebut di deklarasikan.

const tidak dapat diperbaharui atau di deklarasikan ulang

Ini berarti nilai variabel const tetap sama selagi didalam scope nya. Tidak dapat diperbaharui atau di deklarasikan ulang. Jadi jika kita mendeklarasikan variabel dengan const, kita dapat melakukan seperti ini:

    const greeting = "say Hi";
    greeting = "say Hello instead";// error: Assignment to constant variable. 

dan juga ini:

    const greeting = "say Hi";
    const greeting = "say Hello instead";// error: Identifier 'greeting' has already been declared

Maka dari itu, Semua deklarasi const, harus diinisialisasi di waktu pendeklarasian nya.

Aturan ini entah bagaimana berbeda ketika const di deklarasikan ke objek. Selagi objek const tidak dapat di perbaharui, properti nya dapat di perbaharui. Oleh karena itu, jika kita mendeklarasikan objek const seperti ini:

    const greeting = {
        message: "say Hi",
        times: 4
    }

kita tidak dapat melakukan ini:

    greeting = {
        words: "Hello",
        number: "five"
    } // error:  Assignment to constant variable.

tapi kita dapat melakukan ini:

    greeting.message = "say Hello instead";

Ini akan memperbaharui nilai dari greeting.message tanpa error.

Hoisting pada const

Seperti layaknya  let, const pendeklarasian nya akan dinaikkan ke atas tapi tidak akan diinisialisasi.

Berikut adalah perbedaannya Var, Let, dan Const

• deklarasi var adalah scope global atau scope function sementara let dan const adalah  scope blok.
• variabel var dapat diperbaharui dan dideklarasikan ulang didalam scope nya; variabel let dapat diperbaharui namun tidak dapat dideklarasikan ulang; variabel const juga tidak dapat diperbaharui maupun di deklarasikan ulang.
• Semuanya akan dinaikkan ke atas scope nya. Namu variabel  var akan diinisialisasi dengan  undefined, let dan const tidak akan diinisialisasi
• Sementara  var dan let bisa dideklarasikan tanpa diinisialisasi,const harus diinisialisasi terlebih dahulu pada saat pendeklarasian nya.

original article: Var, Let, and Const – What's the Difference?