Могу ли я получить доступ к переменным из другого файла?

Можно ли использовать переменную в файле с именем first.jsвнутри другого файла с именем second.js?

first.jsсодержит переменную с именем colorcodes.

Как сказал Фермин, переменная в глобальной области видимости должна быть доступна всем сценариям, загруженным после ее объявления. Вы также можете использовать свойство windowили (в глобальной области видимости), thisчтобы получить тот же эффект.

// first.js
var colorCodes = {

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

};

... в другом файле ...

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

... в вашем HTML-файле ...

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

Вы можете экспортировать переменную из первого файла, используя экспорт .

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

Затем импортируйте переменную во второй файл, используя import .

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

экспорт - MDN

Мне понравилось то, что ответил выше, но со мной это не сработало

потому что я declaringэти переменные insideJQuery$( document ).ready()

поэтому убедитесь, что вы объявляете свои переменные внутри <script>тега, а не где-то еще

Это должно работать - определите глобальную переменную в первом файле и получите доступ к нему из второго файла:

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

Обратите внимание, что порядок загрузки файлов сценариев имеет значение для некоторых браузеров (IE6 наверняка, может быть, другие)

Используя Node.js, вы можете экспортировать переменную через модуль.

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

Затем импортируйте модуль / переменную во второй файл, используя require.

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

Вы можете использовать importи exportподход из ES6 с помощью Webpack / Babel, но в Node.js вам нужно включить флаг и использовать расширение .mjs.

Я наткнулся на ampify.js . Это действительно просто в использовании. Чтобы сохранить значение, назовем его «myValue», вы делаете:

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

И чтобы получить к нему доступ, вы делаете

amplify.store("myKey")

Если вы храните свои цветовые коды в глобальной переменной, вы сможете получить к ней доступ из любого файла javascript.

Возможно, я делаю это немного по-другому. Я не уверен, почему я использую этот синтаксис, скопировал его из какой-то книги давным-давно. Но каждый из моих js-файлов определяет переменную. Первый файл, без всякой причины, называется 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();
    })

И затем, если у меня есть большой кусок кода, который я хочу разделить, я помещаю его в отдельный файл и другое имя переменной, но я все еще могу ссылаться на переменные и функции R. Я назвал новый TD без всякой причины:

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

Вы можете видеть, что где в «seffunction» TD я называю R.somefunction. Я понимаю, что это не дает никакой эффективности во время выполнения, потому что нужно загружать оба сценария, но это помогает мне сохранять мой код организованным.

Одним из лучших способов является использование окна. НАЧАЛЬНОЕ СОСТОЯНИЕ

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