为什么 createFunctions 里的 i 等于 10

2017-05-14 14:10:31 +08:00
 kuaizihao

先上代码

function createFunctions() {

var result = new Array();
for(var i=0; i<10; i++) {
    result[i] = function() {
        return i;
    }
}
return result;

}

我在看 js 高级程序设计,其中闭包与变量一节没看懂 当我们调用 result[0]函数时, 这个函数执行到 return 语句,发现并没有 i 这个变量,于是顺着作用链去找,在 createFunctions 里找到了已经变成 10 的 i,于是输出 10。

问题来了:当我们调用 result[0]函数时,createFunctions 里的 i 为什么会变成 10 ?

2822 次点击
所在节点    JavaScript
10 条回复
coo
2017-05-14 14:56:11 +08:00
1. 用 let 可以解决这个问题。
2. 它先定义了十个 function 并没有执行,而此刻 i 已经是 10,这十个 function 指向的全部是同一个 i,所以会返回 10。
kuaizihao
2017-05-14 15:06:06 +08:00
@coo 谢谢回复,
也就是说,js 在执行 for 循环的时候,会先定义所有的 function,然后再执行每个 function 里面的代码?
littleshy
2017-05-14 15:30:31 +08:00
那个 i 是在等你 result 里的函数执行时才确定值的。而这时候循环已经完成,所以 i 已经是 10。
mapleray
2017-05-14 15:46:04 +08:00
搜下 late binding closures
coo
2017-05-14 15:49:02 +08:00
是你的这段代码定义了十个函数,你调用 result[0]() 的时候才执行。
aboutTime
2017-05-14 16:13:59 +08:00
匿名函数运行时执行,可以看看匿名函数和 ES6 的箭头函数以及函数申明
kuaizihao
2017-05-14 16:23:47 +08:00
@littleshy
@mapleray
@coo

for 循环的结果是:

result[0] = function() {return i;};
result[1] = function() {return i;};
~~~
result[9] = function() {return i;};

只有当我调用 result[0]();时才执行 return i ;对不?
coo
2017-05-14 16:30:21 +08:00
@kuaizihao #7 是。
kuaizihao
2017-05-14 16:31:54 +08:00
@aboutTime
谢谢指导
kuaizihao
2017-05-14 16:37:31 +08:00
@coo
@littleshy
@mapleray
@aboutTime

感谢各位 V 友的帮助,谢谢大家!

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/361230

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX