javascript - 下面有一段代码,不太明白这样写的原理和js含义
黄舟
黄舟 2017-04-11 09:56:42
[JavaScript讨论组]

代码如下:

1 var a = [];
2 for (var i = 0; i < 10; i++) {
3   a[i] = function () {
4      console.log(i);
5   };
6 }
7 a[6](); //

在单步的时候,是从第1行开始,下面进入循环第2、3行,然后这样2、3行循环,直到i=10时执行7、4、5行,整个代码执行结束,输出10
问题1:第7行的写法是什么含义?一般都用于什么场景
问题2:为什么会先执行7行,后执行4、5行,且4、5行只执行一次

黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

全部回复(2)
怪我咯

问题1 : a[6]()相当于函数调用
问题2 : 4,5行只是声明了函数没有调用,到了第10行执行a[6]()相当于函数调用,所以执行了4,5行

ringa_lee

看了楼上的回答感觉缺少点什么,我来补充点。
这个代码好多地方是故弄玄虚,其实就是 JS之经典for循环闭包问题

var a = []; // 声明一个数字
for (var i = 0; i < 10; i++) {
    // 生成数组里面的成员
    a[i] = function () {
        console.log(i);
    };
}
console.log(i) // 10
console.log(a) // 里面有十个匿名函数
console.log(a[6]) // 一个匿名函数
a[6](); // 执行函数

我们由上而下执行代码:

代码第2行的 for 循环的中是给数组 a 添加成员

// 向数组添加元素的一个方法:
var arr = [];
arr[0] = 100;
arr[1] = 200;
console.log(arr) // [100, 200] 

所以经过十次循环后 a 现在里面是什么呢? 如下图

那请问 i 是多少呢? i 是代码的第2行 for 里面声明的,但 for 不是作用域环境,所以声明的 i 其实是全局函数

就像这样。
var i;
for (i = 0; i < 10; i++ ) {
    ......
}

那么通循环后 i 的 值已经是 10

那么到 a[6]() 这一行了,其实就是数组执行数组 a 的第7个元素,当然恰巧这个元素是个 function

a[6] 是什么呢?(其实a的10个元素里面都是一样的代码)

a[6]() //等于下面

function() {
    console.log(i) // 输出这个全局函数 i 的值而已
}()

说的有点唠叨,但是感觉上个回答比较笼统,所以多说见谅。

至于你的说应用场景,不好说,面试题算一个。:)
下面链接大同小异,有的简单有的详细,可以认真看看,就明白我说的了。

JS中for循环里面的闭包问题的原因及解决办法
JS之经典for循环闭包问题解决方法
用9种办法解决 JS 闭包经典面试题之 for 循环取 i

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号