Cara Kerja Scoping di JavaScript

administrator September 3, 2023 Software

“Cakupan” mengacu pada konteks eksekusi saat ini di mana kode Anda dapat merujuk atau “melihat” nilai dan ekspresi. Variabel, objek, dan fungsi dari berbagai bagian kode dapat diakses berdasarkan cakupannya. Dalam JavaScript, variabel, objek, dan fungsi dapat memiliki lingkup global, lingkup modul, lingkup blok, atau lingkup fungsi.

Lingkup Global dalam JavaScript

Nilai apa pun yang dideklarasikan di luar fungsi atau blok dalam skrip memiliki cakupan global dan file skrip lainnya di program Anda dapat mengaksesnya.

Misalnya, mendeklarasikan variabel global dalam satu file:

// index.js

let globalVariable = “some value”

Berarti skrip lain di program Anda dapat mengaksesnya:

// otherScript.js

console.log(globalVariable) // some value

Mendeklarasikan variabel JavaScript dalam lingkup global adalah praktik yang buruk karena dapat menyebabkan polusi namespace. Namespace global adalah ruang atas Javascript yang berisi variabel, objek, dan fungsi. Di browser, ia menempel pada objek Window, sementara NodeJS menggunakan objek bernama global.

Mencemari namespace global dapat menyebabkan tabrakan nama. Ini adalah situasi di mana kode Anda mencoba menggunakan nama variabel yang sama untuk hal yang berbeda dalam namespace yang sama. Tabrakan nama sering ditemui dalam proyek besar yang menggunakan beberapa perpustakaan pihak ketiga.

Lingkup Modul

Modul adalah file mandiri yang merangkum dan mengekspor potongan kode untuk modul lain dalam proyek untuk digunakan. Ini memungkinkan Anda untuk mengatur dan memelihara basis kode Anda dengan lebih efisien. Modul ES memformalkan pola modul JavaScript dalam JavaScript pada tahun 2015. Variabel yang Anda deklarasikan dalam modul dicakup ke modul itu, artinya tidak ada bagian lain dari program yang dapat mengaksesnya.

Anda hanya dapat menggunakan variabel yang dideklarasikan dalam modul di luarnya jika modul mengekspor variabel tersebut menggunakan kata kunci export. Anda kemudian dapat mengimpor nama itu ke modul lain menggunakan kata kunci import.

Block Scope

Blok dalam JavaScript adalah tempat sepasang kurung kurawal dimulai dan diakhiri. Variabel yang dideklarasikan di dalam blok dengan kata kunci let, dan const dicakupkan ke blok itu, artinya Anda tidak dapat mengaksesnya di luar itu. Cakupan ini tidak berlaku untuk variabel yang dideklarasikan menggunakan kata kunci var:

{ // Beginning of block

const one = ‘1’

let two = ‘2’

var three = ‘3’

} // End of block

console.log(one) // throws error

console.log(three) // “3”

Variabel yang diapit dalam blok di atas dan dideklarasikan sebagai const atau let hanya dapat diakses di dalam blok. Namun, Anda dapat mengakses variabel yang dideklarasikan menggunakan kata kunci var di luar blok.

Function Scope

Variabel yang dideklarasikan di dalam suatu fungsi biasanya disebut sebagai variabel lokal dan dicakupkan ke dalam fungsi tersebut. Anda tidak dapat mengaksesnya di luar fungsi. Cakupan ini berlaku untuk variabel yang dideklarasikan dengan kata kunci var, let, dan const.

Karena variabel yang dideklarasikan dalam suatu fungsi bersifat lokal untuk fungsi tersebut, nama variabel dapat digunakan kembali. Menggunakan kembali nama variabel cakupan fungsi dikenal sebagai variabel shadowing, dan variabel luar dikatakan ” shadowed.”

Sebagai contoh:

function multiply() {

let one = 1

var two = 2

const three = 3

return one * two * three

}

// Variable shadowing

const three = ‘three’ // Does not throw an error