码迷,mamicode.com
首页 > Web开发 > 详细

JS闭包以及作用域初探

时间:2018-05-03 19:36:56      阅读:178      评论:0      收藏:0      [点我收藏+]

标签:rip   依次   js闭包   script   有意思   span   结果   一个   col   

    以前看到的一个问题,很有意思:

    for (var i = 0; i < 5; i++) {
        setTimeout(function () {
            console.log(i);
        },500);
    }

    循环5个setTimeout, 你会发现console.log的值都是5. 为什么呢,因为setTimeout是个异步函数,for在执行的时候会直接跳过,很明显这里是先执行了循环,setTimeout才开始执行,这个时候变量i 的值已经是5了,所以接连输出5个5.

    但是我们不需要这样的结果,我们希望每个i在每个setTimeout的值跟随for循环来变,于是:

    for (var i = 0; i < 5; i++) {
        (function (i) {
            setTimeout(function () {
                console.log(i);
            }, 500);
        })(i);
    }

    我们使用了一个闭包的匿名函数,每次循环的时候将变量i传进这个“封闭”着的函数里,这样setTimeout里面使用到的i的每个值都不一样,用我的理解就是,闭包使 i 独立了,外部依次传入5个不同的I,这个5个i彼此隔离,在自己的setTimeout里被使用。

    关于闭包是什么,网上有很多解答, http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html  这个人讲得挺细的了

    

    


    回到主题,上面为了是每个setTimeout里输出的值都是当前循环里的值,使用到了闭包,但是还有一种简洁的写法:

    

    for (let i = 0; i < 5; i++) {
        setTimeout(function () {
            console.log(i);
        }, 500);
    }

    使用let以后i的作用域就变成块级作用域了,setTimeout里的每个i都是当前循环里的i,所以最后得到的结果就不是同一个了,而是我们想要的结果!

 

    

 

JS闭包以及作用域初探

标签:rip   依次   js闭包   script   有意思   span   结果   一个   col   

原文地址:https://www.cnblogs.com/sunshine-wy/p/8986791.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!