"Jangan pernah memasukkan variabel dalam lingkup global" adalah praktik terbaik karena membuat variabel tersebut rapuh. Laman web biasa atau terutama aplikasi web biasa cenderung berisi banyak skrip berbeda dari berbagai sumber, dan berhati-hatilah untuk melacak variabel global Anda sendiri, semua orang yang skripnya Anda rujuk mungkin tidak ikut bermain
Anggap saja seperti vaksin. Jika setiap orang memiliki vaksin, tidak akan ada ancaman, dan jika Anda sendiri yang memiliki vaksin, tidak ada ancaman, tetapi sementara semua orang mencoba untuk divaksinasi, jadi Anda mungkin tidak divaksinasi karena tidak ada orang lain yang menjadi milik Anda.
Ada beberapa kebebasan dengan menggunakan global jika Anda namespace. Root namespace Anda adalah global, tetapi Anda hanya mengizinkan satu variabel root namespace. Itu kompromi yang biasanya diterima oleh komunitas Javascript, terutama jika itu terbatas pada aplikasi Anda
Namespace mungkin terlihat seperti ini
window.MyNamespace = { ClassA: function() { }, NestedNamespace1: { ClassB: function() { } } };Ini menempatkan ClassA dan ClassB di nesting dari namespace MyNamespace
(function() { var myClassAInstance = new MyNamespace.ClassA(); var myClassBInstance = new MyNamesapce.NestedNamespace1.ClassB(); })(); _Anda juga dapat membangunnya menggunakan fungsi namespace seperti yang saya buat [di sini], yang juga menjelaskan lebih lanjut bagaimana Anda dapat memanfaatkan kesederhanaan namespace
Namun, secara umum, rekomendasinya adalah menggunakan variabel penutupan di mana saja. Ruang nama adalah minimum, tetapi tidak disarankan karena manfaat dari variabel penutupan. Variabel penutupan adalah variabel yang dideklarasikan dalam eksekusi suatu fungsi. Semua file skrip yang Anda tulis harus terkandung dalam suatu fungsi
JavaScript menggunakan fungsi untuk mengelola ruang lingkup. Variabel yang didefinisikan di dalam fungsi berada dalam lingkup lokal dan tidak tersedia di luar fungsi. Sementara variabel yang didefinisikan di luar fungsi berada dalam lingkup global. Setiap fungsi saat dipanggil membuat ruang lingkup baru
Masalah dengan variabel globalPerlu diingat bahwa setiap fungsi saat dipanggil membuat cakupan baru
Variabel global mudah ditimpa oleh skrip lain. Misalnya ketika dua bagian aplikasi yang terpisah mendefinisikan variabel global dengan nama yang sama tetapi dengan tujuan yang berbeda
Laman web juga umum menyertakan kode yang tidak ditulis oleh pengembang laman, misalnya
- Pustaka JavaScript pihak ketiga
- Kode dari skrip pelacakan dan analitik pengguna pihak ketiga
- Berbagai jenis widget, lencana, dan tombol
- Skrip dari mitra iklan
Contoh 1
Perhatikan contoh berikut. result digunakan tanpa dinyatakan. Ini bisa menjadi sumber masalah
//anti-pattern: implied a global variable
result = x * y
return result
}
Aturan praktisnya adalah selalu mendeklarasikan variabel dengan var
function multiply(x, y) {var result = x * y
return result
}
Contoh 2
Contoh lain yang membuat global tersirat adalah untuk mengaitkan penugasan sebagai bagian dari deklarasi var. Dalam contoh berikut, a bersifat lokal tetapi b menjadi global
function makeSomething() {//anti-pattern: don't use
var a = b = 0
...
}_
Penulisan ulang seperti kode-kode berikut. Baik a dan b bersifat lokal
function makeSomething() {var a, b
a = b = 0
...
}
Contoh 3
Properti dapat dihapus dengan operator hapus sedangkan variabel tidak bisa
Perlu diingat bahwa properti dapat dihapus dengan operator hapus sedangkan variabel tidak bisa
Global yang dibuat dengan var tidak dapat dihapus
delete x
<< false_
Global tersirat yang dibuat tanpa var dapat dihapus terlepas dari apakah dibuat di dalam fungsi
x = 10delete x
<< truefunction makeSomething() {
y= 20
}
delete y
<< true
Contoh 4
Anda menggunakan variabel dan kemudian mendeklarasikannya lebih lanjut dalam fungsi. Lihatlah contoh ini
x = "global" // global variablefunction makeSomething() { console.log(x) // undefined
var x = "local"
console.log(x) // local
}
makeSomething()
console.log(x)
<< undefined
<< local
<< global_
Dalam JavaScript, ini memungkinkan kita untuk memiliki beberapa pernyataan var di mana saja dalam suatu fungsi, dan semuanya bertindak seolah-olah variabel dideklarasikan di bagian atas fungsi
Sebenarnya potongan kode di atas adalah seperti berikut ini. Variabel x dideklarasikan di bagian atas fungsi tetapi nilai x tetap pada posisi saat ini
x = "global" // global variablefunction makeSomething() {
var x
console.log(x) // undefined
x = "local
console.log(x) // local
}
makeSomething()
console.log(x)
<< undefined
<< local
<< global_
Variabel Global tidak buruk dan bahkan bukan masalah keamanan, tetapi tidak boleh menimpa nilai variabel lain