JavaScript 变量是如何工作的？

Question

我知道 JavaScript vars 指向一个值：

var foo = true;
//... later 
foo = false;

所以在那个例子中我改变了foo指向true -> foo指向false，但如果我这样做：

for (var i=0; i<100; i++){
    var someVar = i;
}

我是否为每次迭代创建一个新变量？

以下两种做同样的方式有区别吗？

var myvar;
for (var i=0; i<100; i++){
    myvar = i;
}

和

for (var i=0; i<100; i++){
    var myvar = i;
}

如果是，为什么？

Answer 1

Javascript ES5 及更早版本没有块作用域，只有函数作用域。此外，在函数范围内声明的所有 javascript 变量的声明都会自动“提升”到函数顶部。

因此，在循环中声明一个变量与在函数顶部声明它然后在循环中引用它并没有什么不同。

请参阅这两个参考资料以获得一些有用的解释：http://www.adequatelygood.com/2010/2/JavaScript-Scoping-and-Hoisting 和 http://net.tutsplus.com/tutorials/javascript-ajax/quick-tip-javascript-hoisting-explained/。

注意：对变量的赋值不会被提升，只是变量的声明。所以，如果你这样做：

function a() {
    for (var i=0; i<100; i++){
        var myvar = i;
    }
}

它是这样工作的：

function a() {
    var myvar;
    for (var i=0; i<100; i++){
        myvar = i;
    }
}

如果您想在 for 循环中创建一个新范围，您可以像这样使用 IIFE（立即调用的函数表达式）：

function a() {
    for (var i=0; i<100; i++){
        (function() {
            var myvar = i;
            // myvar is now a separate variable for each time through the for loop
        })();
    }
}

---

2015 年更新。 ES6（或有时称为 ES2015）提供了确实提供块范围的 let 声明。在这种情况下，let 变量声明仅提升到当前块作用域的顶部。截至 2015 年中期，这尚未在浏览器中广泛实施，但即将推出，并且可以在 node.js 等服务器端环境中使用或通过转译器使用。

所以，在 ES6 中，如果你这样做：

for (let i=0; i<100; i++){
    let someVar = i;
}

i 和 someVar 都将仅在循环本地。

Answer 2

正如@icktoofay 所说，在 javascript 中没有区别。在某些语言中，在每次迭代时，变量都会被实例化，然后超出范围，然后被垃圾回收。

要在 javascript 中模拟这个，你可以这样做：

for (var i=0; i<100; i++){
    (function(){
        var myvar = i;
    })();
}

在这种情况下，myvar 只存在于匿名函数的范围内，因此在每次迭代时，都会创建一个新的 myvar 实例。

Answer 3

通过在变量名之前不断声明var，您可以指示 JavaScript 引擎或解释器将变量重新初始化为未定义的值（undefined 而不是数字、字符串/文本、布尔值，或null) 之前分配，这将是额外的指令，减慢循环执行的速度。您还夸大了代码大小并降低了代码解析/解释/编译的速度。

对于几乎任何应用程序，都没有功能差异，但仍然存在差异，并且在数十万或数十亿次循环执行后差异可能会很明显。但是，函数中重复的同名 VAR 声明会导致 Chrome / V8 中出现致命异常。

更新：在变量名前使用var可证明比省略 var 慢，正如以下在 Chrome/v8 上使用 JavaScript 控制台运行的基准测试所证明的那样。

var startTime = new Date().getTime();
var myvar;
for (var i=0; i<100000; i++){
    myvar = i;
}
console.log(new Date().getTime() - startTime);

var startTimx = new Date().getTime();
var myvax;
for (var j=0; j<100000; j++){
var myvax = j;
}
console.log(new Date().getTime() - startTimx);
161
169

第一个测试用了 161 毫秒，第二个测试（var）用了 169 毫秒。这是 7 毫秒的差异，在多次运行基准测试后保持一致。

整个基准测试被粘贴到 Chrome JavaScript 控制台中，然后在执行前编译，这就是为什么第一个输出不会出现在第一次调用 console.log() 的下方。

自己试试吧！

Answer 4

JSLint 等工具建议您将所有 var 语句放在函数的顶部。这是因为如果你不这样做，JavaScript 本质上会为你做这件事，所以如果你这样做，它就不会那么混乱。在您的示例中，将var 放在哪里并不重要，只要它出现在myvar 的一个定义之前。同样，您也可以在函数顶部声明i。

更有趣的是分层的作用域链，当 JavaScript 想要查找名称时，它会在其中搜索名称。它从 local 到 global 向上搜索范围链，直到找到所述名称的第一个实例。

这就是为什么你可以玩这样的游戏来惹恼你的朋友：

function foofinder() {
    var bar = function () { return foo; },
        foo="beers";
    return bar();
}

foofinder();
>>> "beers"

Answer 5

不，没有区别；在 JavaScript 中，变量的作用域是函数级别，而不是块级别。