lifelong learner — urip iku urup, currently working on accenture.

Javascript es6 – global scope let dan const

0
Degananda.com -

Pada ulasan ini akan membahas mengenai global binding dari penggunaan let dan const. Selain itu juga akan menjelaskan mengenai best practice kapan kita harus menggunakan let ataupun const.

Binding & Variable binding

Secara harfiah arti dari binding adalah mengikat. Dalam konteks variable binding yakni mengikat variable pada kondisi tertentu. Sehingga global variable binding adalah suatu mekanisme yang mengikat variable-variable yang dideklarasikan dalam suatu class. Variable yang telah dibind atau telah di ikat ini maka dapat dipanggil sesuai dengan kondisi bindingnya. Misalkan dibinding secara global maka variable tersebut dapat dipanggil di seluruh class.

Disamping variable binding juga terdapat suatu istilah yang dinamakan event binding. Pengertiannya yaitu suatu user event seperti click, onmouseover, onkeypress, keydown, dsb yang dibind atau di ikat pada suatu fungsi. Namun event binding ini tidak kita bahas dalam ulasan ini.

Pada intinnya binding merupakan kegiatan yang mengikat suatu hal dapat berupa variable, fungsi,event dan lain sebagainnya sehingga dapat dimanfaatkan untuk proses selanjutnya.

Let dan const global binding

Untuk melakukan binding terhadap variable yang dideklarasikan dengan menggunakan let maupun const kita dapat menggunakan syntax dibawah ini.

let a = 'indonesia';
var b = 'raya';

console.log(a);
console.log(b);

function c(){
	console.log(a);
  console.log(b);
}

c();

variable a dan b diatas sekarang telah di bind secara global. Artinnya dapat dipanggil dari berbagai metode. Mulai dari looping, fungsi , callback dan lain sebagainnya. Hasil eksekusi kode diatas pada konsol adalah sebagai berikut ini

itulah proses melakukan global binding terhadap variable. Sangat simpel. Untuk membuktikan bahwa variabel diatas telah di bind secara global maka kita dapat memanggilnya dengan fungsi window. ingat jalankan fungsi window ini pada browser. jika anda menggunakan interpreter diluar browser seperti nodejs window tidak dapat dipanggil

let dega = 'indonesia';
var nanda = 'raya';

console.log(window.dega);
console.log(window.nanda);

hasil dari kode diatas adalah

sehingga terkait dengan window binding maka dapat di simpulkan

  1. let tidak terikat atau terbind  oleh window. namun masih bersifat global scope pada class(dapat dipanggil dimanasaja asalkan dalam satu class).
  2. var terikat dan terbind oleh window pada dom serta bersifat global scope pada class(dapat dipanggil dimanasaja asalkan dalam satu class).

Lalu bagaimana jika variable global tersebut yang telah dideklrasikan dengan menggunakan let maupun var jika dilakukan proses redeklarasi ? jawabannya adalah nilainya akan berubah.

let dega = 'indonesia';
var nanda = 'raya';

dega = 'indonesia2';
nanda = 'raya2';

console.log(window.dega);
console.log(window.nanda);

ketika let ataupun var diredeklarasi maka yang nilai pada variable tersebut akan berubah. Maka akan menghasilkan nilai pada redeklarasi. Perhatikan gambar dibawah ini

Const

Pada const proses global variable binding tidak memiliki perbedaan. Hanya saja const merupakan deklarasi yang bersifat konstan sehingga tidak dapat dilakukan redeklarsi maupun mengganti nilai dari variable tersebut.

Perhatikan kode dibawah ini

const pi = 3.14;
console.log(pi);

function c(){
  console.log(pi);
}
c();

for(let i = 1;i<=2;i++){ console.log(pi) } setTimeout( () => {
    console.log(pi)
   }, 2000
)

Kode diatas jika dieksekusi maka akan menghasilkan

Maka dapat simpulkan bahwa const dapat dibind secara global scope. Artinnya variable yang dideklarasikan dengan const dapat dipanggil atau diakses dengan berbagai macam metode. Mulai dari fungsi, looping , callback dan lain sebagainnya.

Best practice penggunaan let dan const

kapan kita harus menggunakan const ataupun let ?

  1. Guankan let untuk mendeklarasikan variable yang nantinnya dapat berubah valuenya.
  2. Gunakan const untuk mendeklarasikan variable yang tidak dapat berubah valuenya. Contohnya pi(3,14), nilai konversi, dan lain sebagainnya.
  3. Jika tidak ingin repot memikirkan ingin menggunakan let maupun const gunakanlah let. Meski nilai dari suatu variable tidak berubah penggunaan let juga tidak masalah.