js基础进阶--关于setTimeout的思考

欢迎访问我的个人博客：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

转载于:https://www.cnblogs.com/wuxiaolong555/p/9046008.html