与JavaScript范围混淆

Question

我对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);

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

Answer 1

我发现第一个例子更神秘......

在第二个示例中，您不在函数内部声明变量a。因此，当您分配到a时，它会定位到外部的a。很直接。

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

这里要带走两件事：

a）变量和函数声明是＆＃34;悬挂＆＃34;到他们的范围的顶部。尽管function a(){}写在末尾附近，但保留它的变量a已经创建并在范围顶部可见。

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

Answer 2

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

使用TypeScript-File对代码进行编程，可以通过悬停变量来查看变量类型。

当您尝试将数值10应用于变量＆＃34; a＆＃34;时，它也会发出警告，该变量首先被声明为函数。 这就是我喜欢的TypeScript，你可以在这里获得更多相关信息：http://www.typescriptlang.org/

Answer 3

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

Answer 4

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。