javascript - How to understand global and local variable in javascript

Question

1st test:

var a = 1;
function b() {
    a = 10;
    return;
    function a() {}
}
b();
alert(a);    // 1

2nd test:

var a = 1;
function b() {
    a = 10;
    return;
}
b();
alert(a);    // 10

In the first test, a is equal to 1, although I set it to 10 in the method. In the second test, I set it to 10 and it is set to 10 when I output it.. How does this work?

Answer 1

函数声明在函数的局部范围内function a() {}声明了一个变量名（并将函数分配给它）。当您分配给 时，您将分配给该局部变量而不是全局变量。aba

应用提升后，您的代码相当于

var b = function b() {
    var a = function a() {};
    a = 10;
    return;
}
var a = 1;
b();
alert(a);    // 1, obvious now

Answer 2

因为提升会创建一个局部变量a，在您尝试为其赋值之前屏蔽全局变量。

Answer 3

在您的第一个测试中，您创建了一个存储在局部变量中的函数a：

function b() {
    a = 10;
    return;
    function a() {} // can be called using a() inside this function
}

所以你可以a()在你的函数内部调用这个函数b()。尝试：

function b() { 
    a(); // alerts "hi"
    a = 10;
    return;
    function a() { alert("hi"); }
}

现在，您在局部变量 a 中存储数字 10 而不是函数。全局变量保持不变，因此您的外部警报仍然显示 1。

Answer 4

第一个示例（由 JavaScript）解释为：

var a = 1;
function b() {
  var a = function () {};
  a = 10;
  return;
}

在 JavaScript 中，所有局部变量（在本例中为保存函数的局部变量 a）都在函数顶部声明。

局部变量 a 设置为 10 而不是全局变量。然后它在返回后不再存在。