与 JavaScript 范围混淆 [重复]答案

【问题标题】：Confusion with JavaScript scoping [duplicate]与 JavaScript 范围混淆 [重复]
【发布时间】：2016-02-24 12:15:51
【问题描述】：

我对 JavaScript 作用域有一定的了解——该语言具有函数级作用域，并且变量和函数声明被提升到其包含作用域的顶部。但是，我无法弄清楚为什么以下两段代码记录了不同的值：

这会将值 1 记录到控制台：

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

神秘的是，这记录了 10：

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

那么引擎盖下面发生了什么？

【问题讨论】：

【解决方案1】：

您可以使用 Visual-Studio 进行编码：

在 TypeScript-File 中编写代码将使您能够通过悬停变量来查看变量类型。

当您尝试将数值 10 应用于变量“a”时，它也会警告您，该变量最初被声明为函数。这就是我喜欢 TypeScript 的地方，你可以在这里获得更多信息：http://www.typescriptlang.org/

【讨论】：

【解决方案2】：

JavaScript 是基于解释器的。 Javascript {block} 没有作用域，但函数有。

在你的例子中，

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

首先，您将 a 分配为整数 10，但最后您将 a 重新分配为将在作用域结束时消失的函数。

在这段代码中，

var a = 1;
function b() {
    a = 10;
    return;
    function foo() {}
}
b();
console.log(a);

您的a 未被替换，并返回到全局范围，它将记录10。

【讨论】：

【解决方案3】：

这是因为当您使用声明的function 时，它会被提升并转换为函数表达式，即var a = function() {}; 这会与您的a 变量产生冲突。

【讨论】：

【解决方案4】：

我觉得第一个例子更神秘......

在第二个示例中，您没有在函数内部声明变量a。因此，当您分配给a 时，它以外部的a 为目标。非常直接。

在第一个示例中，您在函数内部声明了一个变量a，但以一种不同寻常的方式：通过声明一个名为a 的函数。因此分配给a 将使用该本地“变量”。

这里有两件事要带走：

a) 变量和函数声明被“提升”到其作用域的顶部。虽然function a(){} 写在末尾附近，但保存它的变量a 已经创建并在范围顶部可见。

b) 函数也可以用作变量。您可以传递函数，也可以重新分配函数定义。它们与其他变量共享相同的命名空间。

【讨论】：