Posso acessar variáveis ​​de outro arquivo?

É possível usar uma variável em um arquivo chamado first.jsdentro de outro arquivo chamado second.js?

first.jscontém uma variável chamada colorcodes.

Como Fermin disse, uma variável no escopo global deve estar acessível a todos os scripts carregados após a declaração. Você também pode usar uma propriedade de windowou (no escopo global) thispara obter o mesmo efeito.

// first.js
var colorCodes = {

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

};

... em outro arquivo ...

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

... no seu arquivo html ...

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

Você pode exportar a variável do primeiro arquivo usando a exportação .

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

Em seguida, importe a variável no segundo arquivo usando import .

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

exportação - MDN

Gostei da resposta acima , mas, embora não tenha funcionado comigo

porque eu era declaringessas variáveis insideJQuery$( document ).ready()

portanto, certifique-se de declarar suas variáveis ​​dentro da <script>tag e não em outro lugar

Isso deve funcionar - defina uma variável global no firstfile e acesse-a no 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);

Observe que a ordem na qual você carrega os arquivos de script é significativa para alguns navegadores (IE6 com certeza, talvez outros)

Usando o Node.js, você pode exportar a variável via módulo.

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

Em seguida, importe o módulo / variável no segundo arquivo usando require.

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

Você pode usar o importe exportaproach do ES6 usando Webpack / Babel, mas no Node.js você precisa habilitar um sinalizador e usa a extensão .mjs.

Me deparei com amplify.js . É realmente simples de usar. Para armazenar um valor, vamos chamá-lo de "myValue", você faz:

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

E para acessá-lo, você faz

amplify.store("myKey")

Se você armazenar seus códigos de cores em uma variável global, poderá acessá-los a partir de qualquer arquivo javascript.

Eu posso estar fazendo isso um pouco diferente. Não sei por que uso essa sintaxe, copiei-a de algum livro há muito tempo. Mas cada um dos meus arquivos js define uma variável. O primeiro arquivo, sem nenhum motivo, é chamado 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();
    })

E então, se eu tenho um grande pedaço de código que quero separar, coloco em um arquivo separado e um nome de variável diferente, mas ainda posso fazer referência às variáveis ​​e funções R. Liguei para o novo TD sem nenhuma boa razão:

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

Você pode ver que onde na TD 'função' eu chamo de R. alguma função. Sei que isso não fornece nenhuma eficiência de tempo de execução porque os dois scripts precisam carregar, mas ajuda a manter meu código organizado.

Uma melhor maneira é usar o window. ESTADO INICIAL

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