Cara mendeklarasikan variabel global dalam file .js

Question 1

Saya membutuhkan beberapa variabel global yang saya perlukan di semua .jsfile.

Misalnya, perhatikan 4 file berikut:

global.js
js1.js
js2.js
js3.js

Apakah ada cara agar saya dapat mendeklarasikan 3 variabel global global.jsdan mengaksesnya di salah satu dari 3 .jsfile lainnya mengingat saya memuat semua 4 file di atas ke dalam dokumen HTML?

Bisakah seseorang memberi tahu saya jika ini mungkin atau adakah solusi untuk mencapai ini?

Question 2

Cukup tentukan variabel Anda di global.js di luar cakupan fungsi:

// global.js
var global1 = "I'm a global!";
var global2 = "So am I!";

// other js-file
function testGlobal () {
    alert(global1);
}

Untuk memastikan bahwa ini berfungsi, Anda harus menyertakan / menautkan ke global.js sebelum Anda mencoba mengakses variabel apa pun yang ditentukan dalam file itu:

<html>
    <head>
        <!-- Include global.js first -->
        <script src="/YOUR_PATH/global.js" type="text/javascript"></script>
        <!-- Now we can reference variables, objects, functions etc. 
             defined in global.js -->
        <script src="/YOUR_PATH/otherJsFile.js" type="text/javascript"></script>
    </head>
    [...]
</html>

Anda dapat, tentu saja, menautkan dalam tag skrip tepat sebelum penutup <body> -tag jika Anda tidak ingin pemuatan file-js mengganggu pemuatan halaman awal.

Question 3

Pendekatan yang direkomendasikan adalah:

window.greeting = "Hello World!"

Anda kemudian dapat mengaksesnya dalam fungsi apa pun:

function foo() {

   alert(greeting); // Hello World!
   alert(window["greeting"]); // Hello World!
   alert(window.greeting); // Hello World! (recommended)

}

Pendekatan ini lebih disukai karena dua alasan.

Maksudnya eksplisit. Penggunaan varkata kunci dapat dengan mudah mengarah pada pernyataan global varsyang dimaksudkan untuk menjadi lokal atau sebaliknya. Variabel cakupan semacam ini adalah titik kebingungan bagi banyak pengembang Javascript. Jadi sebagai aturan umum, saya memastikan semua deklarasi variabel diawali dengan kata kunci varatau awalan window.
Anda membakukan sintaks ini untuk membaca variabel dengan cara ini juga yang berarti cakupan lokal vartidak mengganggu global varatau sebaliknya. Misalnya, apa yang terjadi di sini ambigu:

 greeting = "Aloha";

 function foo() {
     greeting = "Hello"; // overrides global!
 }

 function bar(greeting) {
   alert(greeting);
 }

 foo();
 bar("Howdy"); // does it alert "Hello" or "Howdy" ?

Namun, ini jauh lebih bersih dan lebih sedikit rawan kesalahan (Anda tidak perlu mengingat semua aturan pelingkupan variabel):

 function foo() {
     window.greeting = "Hello";
 }

 function bar(greeting) {
   alert(greeting);
 }

 foo();
 bar("Howdy"); // alerts "Howdy"

Question 4

Apakah kamu sudah mencobanya

Jika kamu melakukan:

var HI = 'Hello World';

Masuk global.js. Lalu lakukan:

alert(HI);

Di js1.jsdalamnya akan baik-baik saja peringatan itu. Anda hanya perlu memasukkan global.jssebelum sisanya dalam dokumen HTML.

Satu-satunya tangkapan adalah Anda harus mendeklarasikannya dalam lingkup jendela (bukan di dalam fungsi apa pun).

Anda dapat mengubah varbagian tersebut dan membuatnya seperti itu, tetapi ini bukan praktik yang baik.

Question 5

Seperti disebutkan di atas, ada masalah dengan penggunaan cakupan paling atas di file skrip Anda. Berikut adalah masalah lain: File skrip mungkin dijalankan dari konteks yang bukan konteks global di beberapa lingkungan run-time.

Telah diusulkan untuk menetapkan global untuk windowsecara langsung. Tetapi itu juga bergantung pada waktu berjalan dan tidak berfungsi di Node, dll. Ini menunjukkan bahwa manajemen variabel global portabel memerlukan pertimbangan yang cermat dan upaya ekstra. Mungkin mereka akan memperbaikinya di versi ECMS mendatang!

Untuk saat ini, saya akan merekomendasikan sesuatu seperti ini untuk mendukung manajemen global yang tepat untuk semua lingkungan run-time:

/**
 * Exports the given object into the global context.
 */
var exportGlobal = function(name, object) {
    if (typeof(global) !== "undefined")  {
        // Node.js
        global[name] = object;
    }
    else if (typeof(window) !== "undefined") {
        // JS with GUI (usually browser)
        window[name] = object;
    }
    else {
        throw new Error("Unkown run-time environment. Currently only browsers and Node.js are supported.");
    }
};


// export exportGlobal itself
exportGlobal("exportGlobal", exportGlobal);

// create a new global namespace
exportGlobal("someothernamespace", {});

Ini sedikit lebih mengetik, tetapi itu membuat manajemen variabel global Anda tahan di masa depan.

Penafian: Sebagian dari ide ini datang kepada saya saat melihat versi stacktrace.js sebelumnya .

Saya rasa, seseorang juga dapat menggunakan Webpack atau alat lain untuk mendapatkan deteksi lingkungan run-time yang lebih andal dan mengurangi peretasan.

Question 6

Ya, Anda dapat mengaksesnya. Anda harus mendeklarasikannya di 'ruang publik' (di luar fungsi apa pun) sebagai:

var globalvar1 = 'value';

Anda dapat mengaksesnya nanti, juga di file lain.