Pada artikel ini, kita akan menjelajahi variabel global dan cara menggunakannya dalam JavaScript. Namun sebelum beralih menggunakannya, mari kita lihat cara mendeklarasikan variabel
Variabel dapat dideklarasikan sebagai variabel global atau variabel lokal. Setiap variabel memiliki ruang lingkup yang terkait dengannya di mana ia dapat digunakan. Kita dapat mendeklarasikan variabel dengan menggunakan kata kunci varvar, let , dan const. Sebelum ES6 hanya kata kunci var yang dapat digunakan untuk deklarasi
Variabel global memiliki cakupan global dan dapat diakses dari mana saja dalam program atau aplikasi. Variabel-variabel ini dideklarasikan di bagian utama kode sumber dan di luar semua fungsi. Variabel-variabel ini diperbolehkan untuk digunakan oleh setiap fungsi
Variabel global dideklarasikan di awal blok (atas program)
Catatan - Jika Anda menetapkan nilai ke variabel dan lupa mendeklarasikan variabel itu, maka secara otomatis akan dianggap sebagai variabel global
Contoh 1
Pada contoh di bawah ini, kita akan mendeklarasikan variabel global dan melihat apakah variabel tersebut dapat diakses oleh fungsi yang berbeda atau tidak
# indeks. html
Welcome To Tutorials PointKeluaran
Program di atas akan menghasilkan keluaran sebagai berikut
Contoh 2
Dalam contoh di bawah ini, kami mendeklarasikan variabel global menggunakan objek jendela di dalam fungsi dan mencoba mengakses variabel ini dari dalam fungsi lain
Variabel Global. Ini adalah variabel yang didefinisikan dalam lingkup global i. e. di luar fungsi. Variabel-variabel ini memiliki cakupan global, sehingga dapat diakses oleh fungsi apa pun secara langsung. Dalam kasus variabel lingkup global, kata kunci yang dideklarasikan tidak masalah, semuanya bertindak sama. Variabel yang dideklarasikan tanpa kata kunci juga dianggap global meskipun dideklarasikan dalam fungsi
Variabel Lokal. Saat Anda menggunakan JavaScript, variabel lokal adalah variabel yang ditentukan dalam fungsi. Mereka memiliki cakupan lokal, yang berarti bahwa mereka hanya dapat digunakan dalam fungsi yang mendefinisikannya. Mengaksesnya di luar fungsi akan menimbulkan kesalahan
Cara menggunakan variabel
- Ruang lingkup variabel atau fungsi menentukan kode apa yang memiliki akses ke sana
- Variabel yang dibuat di dalam suatu fungsi adalah variabel lokal, dan variabel lokal dan variabel lokal hanya dapat dirujuk oleh kode di dalam fungsi tersebut
- Variabel yang dibuat di luar fungsi adalah variabel global, dan kode di semua fungsi memiliki akses ke semua variabel global
- Jika Anda lupa mengkode kata kunci var dalam deklarasi variabel, mesin JavaScript menganggap bahwa variabel tersebut bersifat global. Ini dapat menyebabkan masalah debug
- Secara umum, lebih baik meneruskan variabel lokal dari satu fungsi ke fungsi lainnya sebagai parameter daripada menggunakan variabel global. Itu akan membuat kode Anda lebih mudah dipahami dengan sedikit kemungkinan kesalahan
Contoh 1. Dalam contoh ini, kami akan mendeklarasikan variabel dalam lingkup global sehingga dapat diakses di mana saja dalam program
HTML
<h1 style="color: green">
_GeeksforGeeks
</h1>
<h12>
_h15
</h12>
<h12 style1=style3style4h12>
<h12 style1==1style4h12>
<=6>
=_9
_"color: green"1
"color: green"2
_"color: green"_4
"color: green"5"color: green"6
"color: green"7"color: green"8
"color: green"9>0
>1>2
>1>4
>1>6
>7>8
"color: green"2
_ 1
"color: green"7 3
"color: green"7 5
"color: green"7 7
"color: green"7 9
"color: green"7GeeksforGeeks1GeeksforGeeks2GeeksforGeeks3
"color: green"7GeeksforGeeks5
</=6>
Keluaran
Penjelasan. Kita dapat melihat bahwa variabel petName dideklarasikan dalam lingkup global dan mudah diakses di dalam fungsi. Selain itu, buah dideklarasikan di dalam fungsi tanpa kata kunci apa pun sehingga dianggap global dan dapat diakses di dalam fungsi lain.
Contoh 2. Dalam contoh ini, kami akan mendeklarasikan variabel dalam lingkup lokal dan mencoba mengaksesnya pada lingkup yang berbeda
HTML
<h1 style=</3</4h1>
</_7
<h12 style1==1>
_h15
</h12>
<h12 style1=style3>
_h1_06
</h12>
<h12 style1=h114>
_h1_17
</h12>
<=6>
_h1_25
_h1_27
_h1_29
_h1_31
"color: green"5h133
"color: green"5h135
>8
_h1_39
"color: green"5h141
"color: green"5h143
>8
_h1_47
</=6>
Keluaran
Penjelasan. Kita dapat melihat bahwa variabel petName dideklarasikan dalam lingkup global tetapi tidak diinisialisasi. Juga, fungsi mengakses variabel dalam di mana setiap fungsi memiliki nilainya sendiri untuk variabel petName
Di mana menggunakan variabel mana
- Meskipun tampaknya lebih mudah menggunakan variabel global daripada meneruskan data ke suatu fungsi dan mengembalikan data darinya, variabel global sering menimbulkan masalah. Itu karena fungsi apa pun dapat memodifikasi variabel global, dan terlalu mudah untuk salah mengeja nama variabel atau memodifikasi variabel yang salah, terutama dalam aplikasi besar. Itu, pada gilirannya, dapat menimbulkan masalah debugging
- Sebaliknya, penggunaan variabel lokal mengurangi kemungkinan konflik penamaan. Misalnya, dua fungsi berbeda dapat menggunakan nama yang sama untuk variabel lokal tanpa menyebabkan konflik. Itu tentu saja, berarti lebih sedikit kesalahan dan masalah debug. Dengan hanya beberapa pengecualian, maka semua kode dalam aplikasi Anda harus dalam fungsi sehingga semua variabel bersifat lokal
- Jika Anda salah mengeja nama variabel yang telah Anda nyatakan, itu akan diperlakukan sebagai variabel global baru. Dengan mengingat hal ini, pastikan untuk menyertakan kata kunci saat Anda mendeklarasikan variabel baru dan selalu mendeklarasikan variabel sebelum Anda merujuknya ke dalam kode Anda
Catatan. Gunakan variabel lokal jika memungkinkan. Selalu gunakan kata kunci var untuk mendeklarasikan variabel baru sebelum variabel tersebut dirujuk oleh pernyataan lain