欢迎访问我的个人博客:http://www.xiaolongwu.cn
先热身
看看下面的额代码会打印出什么?
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i);
}, 100);
}
上面的结果是 5 5 5 5 5
我对上面的代码的理解是:
setTimeout是一个注册事件,当for循环遇见他时,会先注册这个事件,而不会去触发此事件,for循环的时间很短,所以当100毫秒后触发打印事件时,此时的i已经变为5,所以会打印出5个5;
那么上面的额代码我们改如何修改才能打印出0~4呢?
for(var i = 0; i < 5; i++) {
(function(k){
setTimeout(function() {
console.log(k);
}, 100);
})(i);
}
没错,上面的代码可以打印出我们想要的结果,他的结果为0~4,可是为什么呢?
我们所采用的解决方案是闭包,闭包可以延长其私有变量的生命周期,意思就是内部私有变量和函数保存下来,一直在内存中,之后到你用时他再给你
那么我们可以再把上面的题目延伸一下
for (var i = 0; i < 5; ++i) {
setTimeout(function () {
console.log(i + ' ');
},0);
}
console.log(0);
//请看这段代码,我在for循环后面加了段代码,而且把延时器事件的触发时间改为了0,请先想想结果会是什么?
可能有会两种想法
第一种为:5 5 5 5 5 0;
第二种结果为: 0 5 5 5 5 5;
那么哪一种结果是正确的呢?
其实正确结果是第二种
那么为什么呢?因为setTimeout是异步的(是注册事件),他会先把函数注册到事件队列当中,等待主程序走完,然后再被调用。所以答案为第二种;
我的github资源地址:https://github.com/js基础进阶--关于setTimeout的思考.md
我的个人博客地址:http://www.xiaolongwu.cn
我的博客园地址:http://www.cnblogs.com/wuxiaolong555
我的CSDN博客地址:https://blog.csdn.net/wxl1555
如果您对我的博客内容有疑惑或质疑的地方,请在下方评论区留言,或邮件给我,共同学习进步。
邮箱:wuxiaolong802@163.com