JavaScript 中的函数顺序

Question

我的问题基于“面向对象的 JavaScript”一书中的示例（第 81 页 - 词汇范围）

所以，我从这个例子中了解到……

function f1(){var a = 1; f2();}
function f2(){return a;}
f1();

：

a 未定义

但是，f1 如何了解在 f1 之后定义的 f2 呢？

这种行为提出了一个问题：

JavaScript 解释器如何工作？

我假设它：

1. 扫描代码并简单地将函数存储在全局环境中，而不是分配给任何变量
2. 以临时方式调用函数：当全局环境中没有这样的函数时，则抱怨。

Answer 1

函数声明在进入可执行上下文（例如，全局上下文或函数调用）时进行处理，然后再处理上下文中的任何分步代码。

因此，在您的代码中，会发生以下事情（按此顺序）：

1. 为执行上下文创建“变量对象”。
2. “变量对象”上的条目（实际上是字面上的属性）是为上下文中的每个 var 和函数声明（加上一些其他内容）创建的。在您的例子中，即 f1 和 f2。最初，这些属性的值为未定义。
3. 所有函数声明都已处理，因此：
   • f1 函数已定义并分配给变量对象的属性。
   • 定义 f2 函数并将其分配给变量对象的属性。
4. 执行 f1(); 行，调用 f1 函数。
5. f1 代码引用 f2，它是从变量对象中获取的，因此它就是我们所期望的（对 f2 的引用） > 功能）。

更有趣的版本是这样的：

f1();
function f1(){var a = 1; f2();}
function f2(){return a;}

...它的发生顺序与上面列出的顺序完全相同，因为这两个声明都是在第一行分步代码之前处理的。

函数声明与函数表达式不同，函数表达式就像任何其他表达式一样，在代码的逐步执行中到达时对其进行求值。函数表达式是指您创建函数并将其用作右手值的任何时间，例如，将结果分配给变量或将其传递给另一个函数。像这样：

var f2 = function() {
};

或这样

setTimeout(function() {
    alert("Hi there");
}, 1000);

请注意，我们使用 function 语句的结果作为右侧值（在赋值中，或将其传递到函数中）。这些不会在进入执行上下文时进行预处理（例如，不在上面的步骤3），而是在代码流到达它们时进行处理。这会导致：

f1();
function f1(){var a = 1; f2();}
var f2 = function(){return a;};

...失败，因为 f2 在调用时尚未定义。

您可以将声明的函数的值用作右侧值，而无需将其转换为函数表达式（我们一直这样做），只要您在两个单独的语句中执行此操作即可。所以：

alert("Beginning");
function foo() { ... }
setTimeout(foo, 100);

按以下顺序发生：

1. 创建 foo （因为它是由声明定义的）。
2. 警报运行。
3. setTimeout 运行。
4. （稍后）foo 被调用。

最后一点：虽然它们应该工作，但包含函数名称的函数表达式不能在所有实现上可靠地工作，目前必须避免：

var f = function foo() { ... }; // <== DON'T DO THIS

或者

setTimeout(function foo() {     // <== DON'T DO THIS
}, 1000);

Internet Explorer特别是，这些方面存在问题，其他实现在不同时间也存在问题。

更多探索：

• 糟糕的误解var
• 闭包并不复杂（因为它谈论变量对象以及如何解析符号）
• Anonymouses 匿名（详细讨论命名函数表达式）

Answer 2

您无权访问函数 f1 内的变量“a”，因为

如果您在 f1 内定义 f2，则函数 f2 未在 f1 范围内定义：

function f1(){function f2(){return a;} var a = 1; f2();}
f1();

您没有任何问题