Can I access variables from another file?

问题:

Is it possible to use a variable in a file called first.js inside another file called second.js?

first.js contains a variable called colorcodes.

回答1:

As Fermin said, a variable in the global scope should be accessible to all scripts loaded after it is declared. You could also use a property of window or (in the global scope) this to get the same effect.

// first.js
var colorCodes = {

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

};

... in another file ...

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

... in your html file ...

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

回答2:

This should work - define a global variable in firstfile and access it from 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);

Note that the order in which you load the script files is significant for some browsers (IE6 for sure, maybe others)

回答3:

I did like what answer above said but although, it didn\'t worked with me

because I was declaring these variables inside JQuery $( document ).ready()

so make sure you declare your variables inside the <script> tag not somewhere else

回答4:

You can export the variable from first file using export.

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

Then, import the variable in second file using import.

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

export - MDN

回答5:

I came across amplify.js. It\'s really simple to use. To store a value, let\'s call it \"myValue\", you do:

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

And to access it, you do

amplify.store(\"myKey\")

回答6:

If you store your colorcodes in a global variable you should be able to access it from either javascript file.

回答7:

I may be doing this a little differently. I\'m not sure why I use this syntax, copied it from some book a long time ago. But each of my js files defines a variable. The first file, for no reason at all, is called 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();
    })

And then if I have a big piece of code that I want to segregate, I put it in a separate file and a different variable name, but I can still reference the R variables and functions. I called the new one TD for no good reason at all:

    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();
    })

You can see that where in the TD \'sepfunction\' I call the R.somefunction. I realize this doesn\'t give any runtime efficiencies because both scripts to need to load, but it does help me keep my code organized.