Javascript提升-我们如何访问某些变量?

Question

我有两个关于吊装的问题:

函数声明被提升的方式是，它们被提升到最顶端，甚至在变量声明之上。

如果我们有这样的代码:

function fn() {
callback();
}
function callback() {
console.log('why does this show');
}

我不明白这是如何工作的，因为两个函数都被提升到顶部(这有效地产生了已经存在的相同代码)。但callback仍然是在fn下面创建的，我不明白为什么我们可以在fn中访问它。我的猜测是，这与顶级对象能够相互访问而不考虑词法位置有关。

同样:

var a = 10;
function fn() {
console.log(a);
}
fn();

这是如何工作的?因为我理解提升的方式使得函数似乎应该在var a之上提升，这使得变量在函数中似乎总是不可访问的。

Answer 1

我们可以深入到这个兔子洞，但我想试着简单解释一下你的例子是如何工作的。

每当JavaScript引擎创建一个执行上下文(也称为调用堆栈)时，无论是通过全局作用域中的函数还是代码，它都会创建一个词法环境。它是一种数据结构，通过引用保存关于自己作用域中或父作用域中变量和函数的名称/值对的集合。

关于第一个例子。这两个函数都被添加到全局执行上下文中。如果你在第一个例子中调用fn()。然后，它将callback()添加到fn()的调用堆栈中，并相应地执行它。因此，在这种情况下，函数的顺序并不重要。

你的第二个例子是一个不同的情况。执行上下文知道您引用的是全局变量，因此向词法环境添加了一个引用，这使得它能够在fn()中使用该变量。

这很难理解。有大量的资源与提升、作用域、词法环境和执行上下文相关，所以一定要查看它们。:)

Answer 2

这是因为我们的Javascript引擎解析和编译代码的方式。

我不是专家，但V8 (JS的chrome引擎)在第一个文件中得到所有的变量和函数名称，并存储所有的函数引用。所以，你可以"使用"声明"之前的函数因为JS知道函数在哪里。

一些语言，甚至c++，你可以这样做，这是一个很好的特性:)