Question

我正在研究JS中变量范围的概念，在它上面找到了这个例子：

(function() {
    var foo = 1;
    function bar() {
        var foo = 2;
    }
    bar();
    console.log(foo) //outputs 1
    if(true) {
        var foo = 3;
    }
    console.log(foo) //outputs 3
})();

此功能的输出是

1 
3

现在我很困惑，foo如何在第二个日志中获得值3。即使在foo语句中使用var声明if时也是如此。 foo中声明的if不应该有bar()中的新实例吗？

Answer 1

if没有引入范围块（我理解它在某些语言中有用）。在JavaScript中，只有function() {}会创建范围块。

Answer 2

Javascript中只有两种范围;功能范围和全球范围。

if语句中的代码没有自己的范围，因此if语句中的变量与其外部的变量相同。

在作用域中多次声明变量不会创建多个变量。 var语句中的if关键字被忽略，因为变量已在范围内声明一次，因此它只是一个赋值。

另请注意，变量声明被提升到作用域的顶部，因此即使声明位于未执行的代码块内，仍会创建变量：

var foo = 1; // a global variable
(function() {
  console.log(foo) //outputs "undefined"
  foo = 2; // sets the local variable
  if(false) {
    var foo = 3; // creates the local variable, but the assignment never happens
  }
  console.log(foo) //outputs 2
})();
console.log(foo) //outputs 1

变量范围混淆javascript

2 个答案: