我需要在所有.js
个文件中使用一些全局变量。
例如,请考虑以下4个文件:
global.js
js1.js
js2.js
js3.js
我是否可以在global.js
中声明3个全局变量,并在其他3个.js
文件中访问它们,考虑到我将上述所有4个文件加载到HTML文档中?
有人可以告诉我这是否可行或是否有解决方法?
答案 0 :(得分:90)
只需在函数范围外的global.js中定义变量:
// global.js
var global1 = "I'm a global!";
var global2 = "So am I!";
// other js-file
function testGlobal () {
alert(global1);
}
为了确保这一点有效,在尝试访问该文件中定义的任何变量之前,必须包含/链接到global.js:
<html>
<head>
<!-- Include global.js first -->
<script src="/YOUR_PATH/global.js" type="text/javascript"></script>
<!-- Now we can reference variables, objects, functions etc.
defined in global.js -->
<script src="/YOUR_PATH/otherJsFile.js" type="text/javascript"></script>
</head>
[...]
</html>
当然,如果您不希望加载js文件来中断初始页面加载,您可以在关闭&lt; body&gt; -tag之前链接脚本标记。
答案 1 :(得分:84)
推荐的方法是:
window.greeting = "Hello World!"
然后您可以在任何功能中访问它:
function foo() {
alert(greeting); // Hello World!
alert(window["greeting"]); // Hello World!
alert(window.greeting); // Hello World! (recommended)
}
出于两个原因,这种方法是首选。
意图是明确的。使用var
关键字很容易导致声明本地的vars
,反之亦然。对于许多Javascript开发人员来说,这种变量范围是一个混乱点。因此,作为一般规则,我确保所有变量声明都以关键字var
或前缀window
开头。
您将此语法标准化以便以这种方式读取变量,这意味着本地范围的var
不会破坏全局var
,反之亦然。例如,这里发生的事情是模棱两可的:
greeting = "Aloha";
function foo() {
greeting = "Hello"; // overrides global!
}
function bar(greeting) {
alert(greeting);
}
foo();
bar("Howdy"); // does it alert "Hello" or "Howdy" ?
然而,这更清晰,更不容易出错(你真的不需要记住所有变量范围规则):
function foo() {
window.greeting = "Hello";
}
function bar(greeting) {
alert(greeting);
}
foo();
bar("Howdy"); // alerts "Howdy"
答案 2 :(得分:7)
你试过吗?
如果你这样做:
var HI = 'Hello World';
在global.js
。然后做:
alert(HI);
在js1.js
中,它会提醒它。您只需在HTML文档中包含global.js
之前的其他内容。
唯一的问题是你必须在窗口的范围内声明它(不在任何函数内)。
你可以只修改var
部分并以这种方式创建它们,但这不是好习惯。
答案 3 :(得分:5)
如上所述,在脚本文件中使用最顶层作用域存在问题。这是另一个问题:脚本文件可能是在某些运行时环境中不是全局上下文的上下文中运行的。
建议直接将全局分配给window
。但这也是依赖于运行时的,并且在Node等中不起作用。这表明便携式全局变量管理需要一些仔细的考虑和额外的努力。也许他们会在未来的ECMS版本中修复它!
目前,我建议使用这样的方法来支持所有运行时环境的正确全局管理:
/**
* Exports the given object into the global context.
*/
var exportGlobal = function(name, object) {
if (typeof(global) !== "undefined") {
// Node.js
global[name] = object;
}
else if (typeof(window) !== "undefined") {
// JS with GUI (usually browser)
window[name] = object;
}
else {
throw new Error("Unkown run-time environment. Currently only browsers and Node.js are supported.");
}
};
// export exportGlobal itself
exportGlobal("exportGlobal", exportGlobal);
// create a new global namespace
exportGlobal("someothernamespace", {});
它有点打字,但它使您的全局变量管理面向未来。
免责声明:在查看以前版本的stacktrace.js时,我想到了这个想法的一部分。
我认为,人们也可以使用Webpack或其他工具来获得更可靠,更少hackish的运行时环境检测。
答案 4 :(得分:2)
是的,你可以访问它们。您应该在“公共空间”(在任何函数之外)将它们声明为:
var globalvar1 = 'value';
您可以稍后访问它们,也可以在其他文件中访问它们。