JavaScript函数声明和评估顺序

Question

为什么这些示例中的第一个不起作用，而其他所有示例都起作用？

// 1 - does not work
(function() {
setTimeout(someFunction1, 10);
var someFunction1 = function() { alert('here1'); };
})();

// 2
(function() {
setTimeout(someFunction2, 10);
function someFunction2() { alert('here2'); }
})();

// 3
(function() {
setTimeout(function() { someFunction3(); }, 10);
var someFunction3 = function() { alert('here3'); };
})();

// 4
(function() {
setTimeout(function() { someFunction4(); }, 10);
function someFunction4() { alert('here4'); }
})();

Answer 1

这既不是范围问题，也不是关闭问题。问题在于 声明 和 表达式 之间的理解。

JavaScript代码（即使是Netscape的第一个JavaScript版本和Microsoft的第一个副本）也要分两个阶段处理：

阶段1：编译-在此阶段，代码被编译成语法树（字节码或二进制取决于引擎）。

阶段2：执行-然后解析解析的代码。

函数 声明 的语法为：

function name (arguments) {code}

参数当然是可选的（代码也是可选的，但这又意味着什么呢？）。

但是JavaScript也允许您使用 表达式 创建函数。函数表达式的语法与函数声明相似，区别在于它们是在表达式上下文中编写的。表达式为：

1. =标志右边（或:对象文字上）的任何内容。
2. 括号中的任何内容()。
3. 函数的参数（实际上已经被2覆盖了）。

*与 *声明 不同的 表达式 在执行阶段而不是在编译阶段进行处理。因此，表达顺序很重要。

因此，澄清一下：

// 1
(function() {
setTimeout(someFunction, 10);
var someFunction = function() { alert('here1'); };
})();

阶段1：编译。编译器看到该变量someFunction已定义，因此可以创建它。默认情况下，所有创建的变量的值均为undefined。请注意，编译器此时无法分配值，因为这些值可能需要解释器执行一些代码才能返回要分配的值。并且在这个阶段我们还没有执行代码。

阶段2：执行。解释器看到您要将变量传递someFunction给setTimeout。确实如此。不幸的是的当前值someFunction是不确定的。

// 2
(function() {
setTimeout(someFunction, 10);
function someFunction() { alert('here2'); }
})();

阶段1：编译。编译器会看到您正在声明一个名称为someFunction的函数，因此它将创建它。

阶段2：解释器看到您要传递someFunction给setTimeout。确实如此。的当前值someFunction是其编译的函数声明。

// 3
(function() {
setTimeout(functhtml" target="_blank">ion() { someFunction(); }, 10);
var someFunction = function() { alert('here3'); };
})();

阶段1：编译。编译器会看到您已经声明了一个变量someFunction并创建了它。和以前一样，它的值是不确定的。

阶段2：执行。解释器将匿名函数传递给setTimeout，以便稍后执行。在此函数中，您会看到您正在使用该变量，someFunction因此它将创建该变量的闭包。此时，的值someFunction仍未定义。然后，您会看到将函数分配给someFunction。此时，的值someFunction不再是未定义的。1/100秒后，setTimeout触发，并调用someFunction。由于其值不再是不确定的，因此它可以工作。

情况4实际上是情况2的另一个版本，其中包含了情况3 someFunction。

附加说明：

您可能想知道为什么setTimeout(someFunction, 10)在someFunction的本地副本和传递给setTimeout的本地副本之间不创建闭包。答案是，JavaScript中的函数参数 始终
是数值（如果是数字或字符串）或其他所有引用都按值传递。因此，setTimeout实际上并不会获取传递给它的变量some​​Function（这将意味着正在创建一个闭包），而只会获取someFunction所引用的对象（在这种情况下为函数）。这是JavaScript中打破闭合（例如在循环中）使用最广泛的机制。