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.

Answer 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?

Answer 2

97

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.

PatrikAkerstrand
sumber

4

Meskipun jawaban ini benar, saya akan merekomendasikan agar Anda menggunakan variabel Javascript Google untuk mendapatkan pemahaman yang lebih baik dan mungkin menghindari melakukan hal-hal dengan cara yang tepat ini.

aleemb

1

Sepakat. Saya selalu mencoba untuk mencakup semua fungsi dan variabel dalam "namespace" umum untuk menghindari kekacauan dan konflik. Biasanya saya menamakannya sebagai singkatan dari proyek atau perusahaan.

PatrikAkerstrand

Merendahkan jawaban ini dan yang lainnya menyukainya karena mengasumsikan bahwa variabel global akan dibuat dalam lingkup global, dan itu juga mensyaratkan bahwa penyebutan pertama variabel berada dalam lingkup global sebelum semua penyebutan lainnya.

Andrew

1

@Andrew Jawaban ini ditulis delapan tahun lalu. Untuk semua maksud dan tujuan, itu benar saat itu. Jika Anda ingin benar-benar memberikan kontribusi, Anda mungkin ingin menyarankan pengeditan?

PatrikAkerstrand

@PatrikAkerstrand Kencan sebenarnya tidak ada bedanya. Jawaban lain yang menggunakan objek global sudah cukup; Saya menjelaskan mengapa ini tidak terjadi.

Andrew

Answer 3

4

Meskipun jawaban ini benar, saya akan merekomendasikan agar Anda menggunakan variabel Javascript Google untuk mendapatkan pemahaman yang lebih baik dan mungkin menghindari melakukan hal-hal dengan cara yang tepat ini.

aleemb

Answer 4

1

Sepakat. Saya selalu mencoba untuk mencakup semua fungsi dan variabel dalam "namespace" umum untuk menghindari kekacauan dan konflik. Biasanya saya menamakannya sebagai singkatan dari proyek atau perusahaan.

PatrikAkerstrand

Answer 5

Merendahkan jawaban ini dan yang lainnya menyukainya karena mengasumsikan bahwa variabel global akan dibuat dalam lingkup global, dan itu juga mensyaratkan bahwa penyebutan pertama variabel berada dalam lingkup global sebelum semua penyebutan lainnya.

Andrew

Answer 6

1

@Andrew Jawaban ini ditulis delapan tahun lalu. Untuk semua maksud dan tujuan, itu benar saat itu. Jika Anda ingin benar-benar memberikan kontribusi, Anda mungkin ingin menyarankan pengeditan?

PatrikAkerstrand

Answer 7

@PatrikAkerstrand Kencan sebenarnya tidak ada bedanya. Jawaban lain yang menggunakan objek global sudah cukup; Saya menjelaskan mengapa ini tidak terjadi.

Andrew

Answer 8

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"

Answer 9

Melampirkan variabel ke jendela harus berfungsi di semua browser (dan juga pendekatan yang saya ambil, +1!).

Dandy

Answer 10

1

@Dan, jika Anda menyatakan "var testvar = 'hello';" di luar fungsi, secara otomatis ditambahkan ke objek jendela dan Anda dapat mengaksesnya dengan "window.testvar".

zkent

Answer 11

1

@zkent, itu benar, tetapi menggunakan objek Window masih lebih baik karena Anda mungkin ingin mengubah kode Anda menjadi sth seperti kopi nanti.

Nami WANG

Answer 12

Apakah lebih baik menggunakan Window daripada Document prefix?

Andrew

Answer 13

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.

Answer 14

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.

Answer 15

2

GLOBALsekarang tidak digunakan lagi, dan globalharus digunakan sebagai gantinya.

Thomas

Answer 16

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.

Cara mendeklarasikan variabel global dalam file .js

Jawaban: