为什么这些示例中的第一个不起作用,而其他所有示例都起作用?
// 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'); } })();
这既不是范围问题,也不是关闭问题。问题在于 声明 和 表达式 之间的理解。
JavaScript代码(即使是Netscape的第一个JavaScript版本和Microsoft的第一个副本)也要分两个阶段处理:
阶段1:编译-在此阶段,代码被编译成语法树(字节码或二进制取决于引擎)。
阶段2:执行-然后解析解析的代码。
函数 声明 的语法为:
function name (arguments) {code}
参数当然是可选的(代码也是可选的,但这又意味着什么呢?)。
但是JavaScript也允许您使用 表达式 创建函数。函数表达式的语法与函数声明相似,区别在于它们是在表达式上下文中编写的。表达式为:
=
:
()
*与 *声明 不同的 表达式 在执行阶段而不是在编译阶段进行处理。因此,表达顺序很重要。
因此,澄清一下:
// 1 (function() { setTimeout(someFunction, 10); var someFunction = function() { alert('here1'); }; })();
阶段1:编译。编译器看到该变量someFunction已定义,因此可以创建它。默认情况下,所有创建的变量的值均为undefined。请注意,编译器此时无法分配值,因为这些值可能需要解释器执行一些代码才能返回要分配的值。并且在这个阶段我们还没有执行代码。
someFunction
阶段2:执行。解释器看到您要将变量传递someFunction给setTimeout。确实如此。不幸的是的当前值someFunction是不确定的。
// 2 (function() { setTimeout(someFunction, 10); function someFunction() { alert('here2'); } })();
阶段1:编译。编译器会看到您正在声明一个名称为someFunction的函数,因此它将创建它。
阶段2:解释器看到您要传递someFunction给setTimeout。确实如此。的当前值someFunction是其编译的函数声明。
// 3 (function() { setTimeout(function() { 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实际上并不会获取传递给它的变量someFunction(这将意味着正在创建一个闭包),而只会获取someFunction所引用的对象(在这种情况下为函数)。这是JavaScript中打破闭合(例如在循环中)使用最广泛的机制。
setTimeout(someFunction, 10)