为什么在这个 javascript 片段提升问题上打印 10

Question

大家好。自大流行以来，我一直在掌握 javascript 行为。我已经知道提升，但前几天我看到一个人将这段代码片段发布到一个组

var foo = 1

function bar(){

    if(!foo){
       var foo = 10
    }

    console.log(foo)
}

bar()

此代码片段打印 10！

我知道 var 声明只是被提升而不是初始化，并且 10 的赋值永远不会发生，因为 !foo 在这里是假的

那么到底为什么要打印 10？请赐教

Answer 1

由于提升了 var，因此在函数内部声明了一个名为 foo 的变量，并用相同的名称屏蔽了全局变量。

此时它还没有被赋值所以它是undefined。

当我们到达函数的第二行时，if 语句触发，因为 !undefined 是 true，所以第 3 行将 10 赋值给它。

然后第 6 行记录它。

Answer 2

我看了几次，这是一张纸上的实际面试问题。如果是这样，就告诉那个人它实际上也可以打印 1.

var fоo = 1

function bar(){
    if(!foo){
       var foo = 10
    }
    console.log(fоo)
}

bar()

不是认真的回答。

Answer 3

在 JavaScript 中，函数和变量声明被提升到执行上下文的顶部。你需要记住这三个规则。

Why 10 is printed on this javascript snippet hoisting question