如何在 JavaScript 中声明全局变量?
如何在 JavaScript 中声明全局变量
如果您必须在生产代码中生成全局变量(应该避免),请始终明确声明它们:
window.globalVar = "This is global!";
虽然可以通过省略var
(假设没有同名的局部变量)来定义全局变量,但这样做会生成一个隐式全局变量,这是一件坏事,并且会在严格模式下产生错误。
如果这是您要使用此变量的唯一应用程序,那么Felix 的方法非常好。但是,如果您正在编写 jQuery 插件,请考虑 jQuery 对象下所需的“命名空间”(后面的引号中的详细信息...)变量和函数。例如,我目前正在开发一个名为 miniMenu 的 jQuery 弹出菜单。因此,我miniMenu
在 jQuery 下定义了一个“命名空间” ,并将所有内容都放在那里。
我在谈论 JavaScript 命名空间时使用引号的原因是它们并不是通常意义上的真正命名空间。相反,我只是使用一个 JavaScript 对象并将我所有的函数和变量作为这个对象的属性。
此外,为了方便起见,我通常用一个i
命名空间为插件命名空间划分空间,这些命名空间应该只在插件内部使用,以便对插件的用户隐藏它。
这是它的工作原理:
// An object to define utility functions and global variables on:
$.miniMenu = new Object();
// An object to define internal stuff for the plugin:
$.miniMenu.i = new Object();
现在我可以做$.miniMenu.i.globalVar = 3
或$.miniMenu.i.parseSomeStuff = function(...) {...}
每当我需要全局保存某些东西时,我仍然将它保留在全局命名空间之外。
注意:问题是关于 JavaScript 的,这个答案是关于 jQuery 的,这是错误的。这是一个古老的答案,从 jQuery 流行的时代开始。
旧的,糟糕的答案
使用 jQuery,无论声明在哪里,您都可以做到这一点:
$my_global_var = 'my value';
并且将随处可用。
当图像散布在不同的地方时,我用它来制作快速图片库,如下所示:
$gallery = $('img');
$current = 0;
$gallery.each(function(i,v){
// preload images
(new Image()).src = v;
});
$('div').eq(0).append('<a style="display:inline-block" class="prev">prev</a> <div id="gallery"></div> <a style="display:inline-block" class="next">next</a>');
$('.next').click(function(){
$current = ( $current == $gallery.length - 1 ) ? 0 : $current + 1;
$('#gallery').hide().html($gallery[$current]).fadeIn();
});
$('.prev').click(function(){
$current = ( $current == 0 ) ? $gallery.length - 1 : $current - 1;
$('#gallery').hide().html($gallery[$current]).fadeIn();
});
提示:在此页面的控制台中运行整个代码;-)
这是您的其余函数可以访问的全局变量的基本示例。这里是一个活生生的例子:http : //jsfiddle.net/fxCE9/
var myVariable = 'Hello';
alert('value: ' + myVariable);
myFunction1();
alert('value: ' + myVariable);
myFunction2();
alert('value: ' + myVariable);
function myFunction1() {
myVariable = 'Hello 1';
}
function myFunction2() {
myVariable = 'Hello 2';
}
如果您在 jQuery ready() 函数中执行此操作,请确保您的变量与其他函数一起位于 ready() 函数中。
在函数外声明变量
function dosomething(){
var i = 0; // Can only be used inside function
}
var i = '';
function dosomething(){
i = 0; // Can be used inside and outside the function
}