我应该使用window.variable还是var？

Question

我们有很多设置JS代码，用于定义将在许多其他JS文件中使用的面板，按钮等。

通常，我们会这样做：

grid.js

var myGrid = .....

combos.js

var myCombo = .....

然后，在我们的应用程序代码中，我们：

的application.js

function blah() {
    myGrid.someMethod()
}

someother.js

function foo() {
    myCombo.someMethod();
    myGrid.someMethod();
}

那么，我们应该使用var myGrid还是更好地使用window.myGrid

有什么不同？

Answer 1

我建议创建一个命名空间变量var App = {};

App.myGrid = ...

这样你就可以限制全局命名空间的污染。

编辑：关于变量问题的数量 - 想到2个可能的解决方案：

1. 您可以通过类型（网格，按钮等）或关系（ClientInfoSection，AddressSection等）进一步命名它们。
2. 您将方法封装在使用您拥有的组件实例化的对象中

例如：你有

function foo() {
    myCombo.someMethod();
    myGrid.someMethod();
}

变为：

var Foo = function(combo, grid) {
    var myCombo = combo;//will be a private property
    this.myGrid = grid;//will be a public property
    this.foo = function() {//public method
        myCombo.someMethod();
        myGrid.someMethod();
    }
}
App.myFoo = new Foo(someCombo, someGrid);
App.myFoo.foo();

这样你就可以限制小对象的数量，只暴露你需要的东西（即foo函数）

PS：如果需要公开内部组件，则将它们添加到构造函数内部

Answer 2

功能上一个潜在的重要区别是window.myGrid可以是deleted，而var myGrid则不能。

var test1 = 'value';
window.test2 = 'value';


console.log( delete window.test1 ); // false ( was not deleted )
console.log( delete window.test2 ); // true  ( was deleted )


console.log( test1 );  // 'value'         ( still accessible )
console.log( test2 );  // ReferenceError  ( no longer exists )

Answer 3

window.variable的一个很好的用途是你可以检查它而不会出现javascript错误。例如，如果您有：

if (myVar) {
    //do work
}

并且myVar未在页面的任何位置定义，您将收到javascript错误。然而：

if (window.myVar) {
    //do work
}

没有错误，并按照人们的预期工作。

var myVar = 'test'和window.myVar = 'test'大致相同。

除此之外，正如其他人所说，你应该从一个全局对象下降，以避免污染全局命名空间。

Answer 4

在全球范围内，这两者实际上是功能相同的。在函数范围内，当需要闭包行为时，var当然更可取。

我会一直使用var：首先，它与闭包中通常首选的行为一致（因此，如果您决定稍后将代码移动到闭包中会更容易），其次，它只会感觉更加语义化我要说我正在创建一个变量而不是附加窗口的属性。但在这一点上它主要是风格。

Answer 5

这个问题的一般答案是使用var。

更具体地说，始终将您的代码放在Immediately Invoked Function Expression (IIFE)中：

(function(){
  var foo,
      bar;
  ...code...
})();

这使得像foo和bar这样的变量不会污染全局命名空间。然后，当您明确希望变量位于全局对象（通常是window）上时，您可以编写：

window.foo = foo;

JavaScript具有功能范围，充分利用它是非常好的。你不希望你的应用程序破解只是因为其他程序员做了一些愚蠢的事情，就像覆盖你的计时器句柄一样。

Answer 6

除了其他答案之外，值得注意的是，如果在声明变量时不在函数内使用var，它会自动泄漏到全局范围，使其成为window对象（或全局范围）的属性。

Answer 7

为了扩展Liviu所说的内容，请使用：

App = (function() {
    var exports = {};
    /* code goes here, attach to exports to create Public API */
    return exports; 
})();

通过这样做，您可以隐藏一些特定于实现的代码，您可能不希望通过使用var内部来暴露这些代码。但是，您可以访问附加到exports对象的任何内容。