资讯专栏INFORMATION COLUMN

我对js函数闭包的理解

testHs / 1005人阅读

摘要:第三个是在里的由于在匿名函数妈妈的肚子里,但是也是个独立的个体,,当运行时,发现函数里用的声明,就不用再进一步去匿名函数妈妈肚子里去找了。直接就输出第四个是在里,但是没有的声明所以当运行时,就去匿名函数妈妈的肚子里去找,果然找到了。

个人理解,请大家指正

个人理解闭包作用:

闭包可以用来隔离作用域(简单来说可以隔离 环境变量、函数...etc),也就是说 一般情况下 函数里申明的变量不会影响到函数外面;这就是其中的一种优势(代码之间互不影响,避免 因 申明的变量命一样造成 代码块冲突)

//想必大家都看见这个这种函数形式
/*
运行结果就是
0 0
1 2
11 12
1 2
*/
var a = b = 0
console.log(a, b) // 0 0
+(function () {
    var a = 1
    var b = 2
    console.log(a, b) // 1 2
    function fn () {
         var a = 11
         var b = 12
        console.log(a,b)
    }
    function fnz () {
        console.log(a, b) 
    }
    fn()  // 11 12
    fnz() // 1 2
}())

解析上面代码块:
第一个console, 输出00, 为什么?因为在全局环境下, 此时运行console.log(a, b) 就会 找到 声明在全局的 a,b = 0.

第二个console, 因为是在匿名函数里,当运行console时,就会先找匿名函数里有没有声明a,b,擦,在妈妈肚子里真找到了a,b变量,就不用去全局奶奶肚子里去找了。就此终止 输出 1 2。

第三个console 是在fn里的, 由于 fn 在 匿名函数妈妈的肚子里,但是 fn 也是个独立的个体,hihi,
当运行console时,发现 fn函数里用 a,b的声明,就不用再进一步去匿名函数妈妈肚子里去找了。
直接就输出 11 12.

第四个console 是在 fnz 里, 但是 fnz 没有 a、b 的声明,所以当console运行时, 就去匿名函数妈妈的肚子里去找, 果然找到了。查找就此结束, 不在去打扰奶奶了。 输出 1,2.

总结,书中写的作用域链

2.复用代码,复用配置,减少代码量。
 // 以下代码不是为了装x
 // 传进去一个函数 a 输出一个 新的函数 b. 相当于给函数a 增加了新的功能。 这就是 thrFn 函数的作用,封装逻辑,提供新的功能
// fn 相当于 a 函数
 var thrFn  = function (fn, time, maxLog) {
                var timeK = null
                // 
                var oTime = new Date().getTime()
                var execFn = function () {
                    fn()
                    oTime = new Date().getTime()
                }
                // 相当与 b 函数
                return function () {
                    var nTime = new Date().getTime()
                    clearTimeout(timeK)
                    if (nTime - oTime > maxLog) {
                        execFn()
                    } else {
                        timeK = setTimeout(execFn, time)
                    }
                }
    }

我的 javascript 节流函数 与 消抖 函数 解析传送门

神烦以下, 我就感觉出题...
var a = []
var b = []
var c = []
for(var i = 0; i < 8; i++) {
    a[i] = function () {
        console.log(i)
    }
}
for(var j = 0; j < 8; j++) {
    b[j] = (function (j) {
        return function () {
            console.log(j)
        }
    })(j)
}
for(var k = 0; k < 8; k++) {
    c[k] = (function () {
        return function () {
            console.log(k)
        }
    })(k)
}
a[6]() // 8
b[6]() // 6
c[6]() // 8

如果你感觉,你真的懂闭包,请看一遍 redux 源码, 尤其是中间件 设计的那一部分。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93855.html

相关文章

  • JS核心知识点梳理——上下文、作用域、闭包、this(中)

    摘要:引言满满的干货,面试必系列,参考大量资料,并集合自己的理解以及相关的面试题,对核心知识点中的作用域闭包上下文进行了梳理。本篇重点介绍闭包和。所以,有另一种说法认为闭包是由函数和与其相关的引用环境组合而成的实体。 showImg(https://segmentfault.com/img/bVbo4hv?w=1800&h=1000); 引言 满满的干货,面试必bei系列,参考大量资料,并集...

    rottengeek 评论0 收藏0
  • 一个前端自我修养

    摘要:今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。的确如此,到目前为止,还没有任何一个大学会教前端,倒是有些培训班,会讲网页开发三剑客。   今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。   很多人都有这样的感觉:听了很多技术圈子的分享,有的有深度,有的循循善诱,深入浅出,但是呢,几年下来,到底哪些用上了,哪些对自己真的有帮助了?反而有些模糊。   201...

    sugarmo 评论0 收藏0
  • 一个前端自我修养

    摘要:今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。的确如此,到目前为止,还没有任何一个大学会教前端,倒是有些培训班,会讲网页开发三剑客。   今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。   很多人都有这样的感觉:听了很多技术圈子的分享,有的有深度,有的循循善诱,深入浅出,但是呢,几年下来,到底哪些用上了,哪些对自己真的有帮助了?反而有些模糊。   201...

    LinkedME2016 评论0 收藏0
  • 一个前端自我修养

    摘要:今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。的确如此,到目前为止,还没有任何一个大学会教前端,倒是有些培训班,会讲网页开发三剑客。   今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。   很多人都有这样的感觉:听了很多技术圈子的分享,有的有深度,有的循循善诱,深入浅出,但是呢,几年下来,到底哪些用上了,哪些对自己真的有帮助了?反而有些模糊。   201...

    Michael_Ding 评论0 收藏0

发表评论

0条评论

testHs

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<