如何以正确的方式在javascript中声明全局变量?

时间:2014-07-18 13:18:50

标签: javascript

检查网站我已经遇到了这段代码;

if (!window.homePosition) window.homePosition = $('#sticky-container').offset().top;

以这两种方式声明全局变量有什么不同吗?

window.homePosition = 400;

var homePosition = 400;

为什么您认为之前的开发人员使用了这种表示法?

2 个答案:

答案 0 :(得分:2)

是的,有两点不同,但实际上它们通常不是很大的。

你有3个陈述

var a=0;

...在变量对象上为全局执行上下文创建一个变量,这是一个全局对象,在浏览器上别名为window(并且是一个DOM窗口对象)而不仅仅是非浏览器实现上的通用对象)。符号window本身实际上是它用来指向自身的全局(窗口)对象的属性。

所有这一切的结果是:它在window上创建了一个您无法删除的属性。它也是在第一行代码运行之前定义的(参见下面的“当var发生时”)。

请注意,在IE8及更早版本中,window上创建的属性不是可枚举的(不会显示在for..in语句中)。在IE9,Chrome,Firefox和Opera中,它是可枚举的。


a=0;

...隐式地在window对象上创建一个属性。由于它是普通属性,您可以删除它。我建议这样做,以后读取你的代码的任何人都不清楚。

有趣的是,再次在IE8及更早版本中,该属性创建的不是可枚举的(不会显示在for..in语句中)。这很奇怪,特别是考虑到以下情况。


window.a=0;

...明确地在window对象上创建一个属性。因为它是普通的属性,你可以删除它。

此属性 可以在IE8及更早版本以及我尝试的其他浏览器上进行枚举。

答案 1 :(得分:-3)

从函数内部的代码中,创建全局变量的唯一方法是在全局对象上创建一个属性(在浏览器中为window)。

许多代码,特别是库,但通常编写良好的代码,将封装在一个函数中,以明确避免创建全局符号:

(function() {
  "use strict";

  // lots of code here

})();

从这些代码内部,如果希望导出全局符号,那么这样做的方法是创建全局上下文的属性:

(function() {
  "use strict";

  // lots of code here

  window.something = valueToExport;

})();

通常编写这样的封装函数,以便可以获得对全局上下文的引用的本地副本:

(function(global) {
  "use strict";

  // lots of code here

  global.something = valueToExport;

})(this);

这是有效的,因为在实际的全局上下文中 - 封装函数运行的地方 - this的值是对该上下文的引用(浏览器中为window)。在上面的示例中,参数global将是对全局上下文对象的本地引用。

编辑 - 如果没有“严格”模式,对作业左侧未声明的符号的引用将会创建一个全局符号。这个页面上的问题是,“如何在JavaScript中以正确的方式声明全局变量”。使用隐式全局属性创建肯定是正确的方式。在“严格”模式下 - 所有新编写的代码都应该使用 - 这是一个错误。