同一个变量声明了两次。用的是哪个？ -- JAVASCRIPT

Question

由于第二个声明将覆盖第一个声明，因此下面的代码将生成 8。是的！完全有道理。

示例 1

function foo(){
    function bar() {
        return 3;
    }
    return bar();
    function bar() {
        return 8;
    }
}
console.log(foo()); // ---> 8

以下代码生成 3，这意味着它是第一个被调用的表达式。

示例 2

function foo(){
    var bar = function() {
        return 3;
    };
    return bar();
    var bar = function() {
        return 8;
    };
}
console.log(foo()); // ---> 3

我倾向于得出结论，在JavaScript中，如上所示，只使用了第一个声明的变量。但是，下面的代码会产生 7（嗯……挠头）

示例 3

var a = 4;
var a = 7;
console.log(a); //---> 7

最终，我将使用 let 或 const（以防止多次声明同一个变量）来声明变量而不是 var，但我试图理解为什么示例 2 和 3 中产生的结果是如此不可预测。谢谢。

Answer 1

示例 1 等同于以下代码。这里 bar 在 return 之前被覆盖，因此使用分配给它的最后一个值对其进行评估。有关您的更多信息，请阅读 Variable and Function Hoisting.

function foo(){
    function bar() {
        return 3;
    }
    
    function bar() {
        return 8;
    }
    
    return bar(); 
}
console.log(foo());

示例 2 等同于以下代码。在这里你可以看到 bar 只声明了一次并且第一个值被分配给它。第二个赋值是在 return 之后完成的，所以代码没有到达它。并且 return 与第一个赋值一起执行。

function foo(){
    var bar;
    bar = function() {
        return 3;
    };
    
    return bar();
    
    bar = function() {
        return 8;
    };
}
console.log(foo());

关于示例3，当您使用var多次声明同一个变量时，后面的var将被忽略。所以像这样

var a = 4;
a = 7;
console.log(a);

Answer 2

不，只是声明函数的方式不同。

就是var functionName = function() {}和function functionName() {}

的区别

假设你有两个函数。

var function1 = function() {

};
function function2() {

}

不同之处在于 function1 是一个函数表达式，因此仅在到达该行时定义。

function1();
var function1 = function() {

};

当编译器到达这一行时会抛出一个错误，如 function1 is not defined.

function2 是一个函数声明，它是全局的（由于提升）。

function2();
function function2() {

}

此代码将调用 function2 函数。

因此，在您的第一个示例中，它与 function2 相同（有一个函数声明）。

在您的第二个示例中，它与 function1 相同（有一个函数表达式）

同一个变量声明了两次。用的是哪个？ -- JAVASCRIPT

Same variable declared twice. Which is one used? -- JAVASCRIPT

javascript

scope

hoisting