javascript - 从另一个 JavaScript 文件导入变量

Question

假设我想将《恶搞之家》的所有季节显示为一个数字。 (15)但当然会有更多的季节，所以我必须在每个文件中更改第 15 至 16 季，依此类推。因为我想为该值创建一个变量，所以我只需为所有文件更改一次即可。

外部js.script

var seasons = "15"; 
document.getElementById('seasons').innerHTML = seasons;

现在我想将变量包含在我的 HTML 文件中:

<div id="seasons"></div>

它可以工作，但在三个变量之后，所有其他变量都不会显示。

是否有更好的方法在外部文件中创建变量？

Answer 1

如果您的应用程序中需要一组常量，通常最好将它们加载到命名空间并在任何其他代码之前加载。

/* app.js */
// Create the namespace
var App = {};

App.Constants = {
  FAMILY_GUY: 15,
  SIMPSONS: 28,
  FUTURAMA: 7
};

/* family-guy.js */
document.getElementById('familyGuy').innerHTML = App.Constants.FAMILY_GUY;

/* simpsons.js */
document.getElementById('simpsons').innerHTML = App.Constants.SIMPSONS;

/* futurama.js */
document.getElementById('futurama').innerHTML = App.Constants.FUTURAMA;

<div id="familyGuy"></div>
<div id="simpsons"></div>
<div id="futurama"></div>

<!-- 
Imagine you're loading your files like this
<script src="app.js"></script>
<script src="family-guy.js"></script>
<script src="simpsons.js"></script>
<script src="futurama.js"></script>
-->