Bisakah saya mengakses variabel dari file lain?

Apakah mungkin untuk menggunakan variabel dalam file yang disebut first.jsdi dalam file lain yang disebut second.js?

first.jsberisi variabel yang disebut colorcodes.

Seperti yang dikatakan Fermin, variabel dalam lingkup global harus dapat diakses oleh semua skrip yang dimuat setelah dideklarasikan. Anda juga bisa menggunakan properti windowatau (dalam lingkup global) thisuntuk mendapatkan efek yang sama.

// first.js
var colorCodes = {

  back  : "#fff",
  front : "#888",
  side  : "#369"

};

... di file lain ...

// second.js
alert (colorCodes.back); // alerts `#fff`

... di file html Anda ...

<script type="text/javascript" src="first.js"></script> 
<script type="text/javascript" src="second.js"></script> 

Anda dapat mengekspor variabel dari file pertama menggunakan ekspor .

//first.js
const colorCode = {
    black: "#000",
    white: "#fff"
};
export { colorCode };

Kemudian, impor variabel dalam file kedua menggunakan impor .

//second.js
import { colorCode } from './first.js'

ekspor - MDN

Saya memang suka apa jawaban di atas tetapi meskipun, itu tidak berhasil dengan saya

karena saya adalah declaringvariabel-variabel ini insideJQuery$( document ).ready()

jadi pastikan Anda mendeklarasikan variabel Anda di dalam <script>tag bukan di tempat lain

Ini seharusnya berfungsi - mendefinisikan variabel global di firstfile dan mengaksesnya dari secondfile:

<script src="/firstfile.js"></script>
<script src="/secondfile.js"></script>

firstfile.js:

var colors = {
   text:'#000000',
   background:'#aaaaaa',
   something_else:'blue'
};

secondfile.js:

do_something_with(colors.background);

Perhatikan bahwa urutan Anda memuat file skrip penting untuk beberapa browser (IE6 pasti, mungkin yang lain)

Menggunakan Node.js Anda dapat mengekspor variabel melalui modul.

//first.js
const colorCode = {
    black: "#000",
    white: "#fff"
};
module.exports = { colorCode };

Kemudian, impor modul / variabel dalam file kedua menggunakan wajib.

//second.js
const { colorCode } = require('./first.js')

Anda dapat menggunakan importdan exportpendekatan dari ES6 menggunakan Webpack / Babel, tetapi di Node.js Anda harus mengaktifkan flag, dan menggunakan ekstensi .mjs.

Saya menemukan amplify.js . Ini sangat mudah digunakan. Untuk menyimpan nilai, sebut saja "myValue", Anda melakukannya:

amplify.store("myKey", "myValue")

Dan untuk mengaksesnya, Anda lakukan

amplify.store("myKey")

Jika Anda menyimpan kode warna dalam variabel global, Anda harus dapat mengaksesnya dari file javascript.

Saya mungkin melakukan ini sedikit berbeda. Saya tidak yakin mengapa saya menggunakan sintaks ini, menyalinnya dari beberapa buku dulu. Tetapi masing-masing file js saya mendefinisikan variabel. File pertama, tanpa alasan sama sekali, disebut R:

    var R = 
    { 
        somevar: 0,
        othervar: -1,

        init: function() {
          ...
        } // end init function

        somefunction: function(somearg) {
          ...
        }  // end somefunction

        ...

    }; // end variable R definition


    $( window ).load(function() {
       R.init();
    })

Dan kemudian jika saya memiliki sepotong besar kode yang ingin saya pisahkan, saya meletakkannya di file yang terpisah dan nama variabel yang berbeda, tetapi saya masih bisa merujuk variabel R dan fungsi. Saya menelepon TD baru tanpa alasan sama sekali:

    var TD = 
    { 
        xvar: 0,
        yvar: -1,

        init: function() {
           ...
        } // end init function

        sepfunction: function() {
           ...
           R.somefunction(xvar);
           ...
        }  // end somefunction

        ...

    }; // end variable TD definition


    $( window ).load(function() {
       TD.init();
    })

Anda dapat melihat bahwa di mana dalam TD 'sepfungsi' saya memanggil fungsi R. Saya menyadari ini tidak memberikan efisiensi runtime karena kedua skrip perlu memuat, tetapi itu membantu saya menjaga kode saya terorganisir.

Salah satu cara terbaik adalah dengan menggunakan jendela. INITIAL_STATE

<script src="/firstfile.js">
    // first.js
    window.__INITIAL_STATE__ = {
      back  : "#fff",
      front : "#888",
      side  : "#369"
    };
</script>
<script src="/secondfile.js">
    //second.js
    console.log(window.__INITIAL_STATE__)
    alert (window.__INITIAL_STATE__);
</script>