资讯专栏INFORMATION COLUMN

JavaScript中的闭包

wqj97 / 2568人阅读

摘要:最准确地来解释对的应用方法是词法作用域的查找规则即在的函数作用域中无法找到则向上一级所嵌套的的作用域中查找,而这些规则只是闭包的一部分。而闭包的神奇之处可以阻止作用域被销毁,被回收。

什么是闭包?

当函数可以记住并访问所在的词法作用域时,就产生了闭包,即使函数是在当前词法作用域之外执行的
下面用一些代码来解释这个定义:

function foo() {
    var a = 2;
    
    function bar() {
        console.log(a);   // 2
    }
    
    bar();
}

foo();

这是闭包吗?
技术上来讲,也许是。但根据前面的定义,确切地说并不是。最准确地来解释 bar() 对 a 的应用方法是词法作用域的查找规则(即在 bar() 的函数作用域中无法找到 a,则向上一级所嵌套的 foo() 的作用域中查找),而这些规则只是闭包的一部分。
下面再看一段代码,清晰地展示了闭包:

function foo() {
    var a =  2;
     
    function bar() {
        console.log(a);
    }
    
    return bar;
}

var baz = foo();

baz();   // 2   这就是闭包的效果

函数 bar() 的词法作用域能够访问 foo() 的内部作用域,然后将 bar() 函数本身作为一个值类型进行传递。在这段代码中,我们将 bar 所引用的函数对象本身作为返回值。在 foo() 执行后,其返回值赋值给变量 baz 并调用 baz(),实际上只是通过不同的标识符引用调用了内部函数 bar()
在 foo() 执行后,通常会期待 foo() 的整个内部作用域都被销毁。而闭包的神奇之处可以阻止作用域被销毁,被回收。那么是谁再使用这个内部作用域?是 bar() 本身在使用。bar() 拥有覆盖 foo() 内部作用域的闭包,使得该作用域能够一直存活,以供 bar() 在之后任何时间进行引用。这个引用就叫做闭包。
再据两个例子:

function foo() {
    var a = 2;
    
    function baz() {
        console.log(a);   //2
    }
    
    bar(baz);
}

function bar(fn) {
    fn();   // 这就是闭包
}
function wait(message) {
    
    setTimeout(function timer(){
        console.log(message);
    },1000);
}

wait("Hello World");
循环和闭包

先看下面的例子:

for(var i=1; i<=5; i++){
    setTimeout(function timer() {
        console.log(i);
    },i*1000);
}

这段代码在运行时会以每秒一次的频率输出五次6.为什么会这样呢?
首先解释6是怎么来的。这个循环的终止条件是 i<=5。条件首次成立时 i 的值是6.因此,输出显示的是循环结束时 i 的最终值。
延迟函数的回调会在循环结束时才执行,当定时器运行时即使每个迭代中执行的是 setTimeout(..,0),所有的回调函数依然是在勋魂结束后才会执行,因此每次都输出6.根据作用域的工作原理,实际情况是尽管循环中的五个函数是在各个迭代中分别定义的,但是它们都是被封闭在一个共享的全局作用域中,因此实际上只有一个 i
再看下一个代码,给上一代码加入更多的词法作用域,且要加入实质内容才能起作用。

for(var i=1; i<=5; i++){
    (function() {
        var j = i;
        setTimeout(function timer(){
            console.log(j);
        },j*1000)
    })();
}

现在就能正常分别输出数字1~5,每秒一次,每次一个。

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

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

相关文章

  • JavaScript中的闭包

    摘要:闭包引起的内存泄漏总结从理论的角度将由于作用域链的特性中所有函数都是闭包但是从应用的角度来说只有当函数以返回值返回或者当函数以参数形式使用或者当函数中自由变量在函数外被引用时才能成为明确意义上的闭包。 文章同步到github js的闭包概念几乎是任何面试官都会问的问题,最近把闭包这块的概念梳理了一下,记录成以下文章。 什么是闭包 我先列出一些官方及经典书籍等书中给出的概念,这些概念虽然...

    HmyBmny 评论0 收藏0
  • JavaScript闭包,只学这篇就够了

    摘要:当在中调用匿名函数时,它们用的都是同一个闭包,而且在这个闭包中使用了和的当前值的值为因为循环已经结束,的值为。最好将闭包当作是一个函数的入口创建的,而局部变量是被添加进这个闭包的。 闭包不是魔法 这篇文章使用一些简单的代码例子来解释JavaScript闭包的概念,即使新手也可以轻松参透闭包的含义。 其实只要理解了核心概念,闭包并不是那么的难于理解。但是,网上充斥了太多学术性的文章,对于...

    CoderBear 评论0 收藏0
  • 还担心面试官问闭包

    摘要:一言以蔽之,闭包,你就得掌握。当函数记住并访问所在的词法作用域,闭包就产生了。所以闭包才会得以实现。从技术上讲,这就是闭包。执行后,他的内部作用域并不会消失,函数依然保持有作用域的闭包。 网上总结闭包的文章已经烂大街了,不敢说笔者这篇文章多么多么xxx,只是个人理解总结。各位看官瞅瞅就好,大神还希望多多指正。此篇文章总结与《JavaScript忍者秘籍》 《你不知道的JavaScri...

    tinyq 评论0 收藏0
  • JavaScript中的闭包

    摘要:权威指南第版中闭包的定义函数对象可以通过作用域链相互关联起来,函数体内部的变量都可以保存在函数作用域内,这种特性在计算机科学文献中成为闭包。循环中的闭包使用闭包时一种常见的错误情况是循环中的闭包,很多初学者都遇到了这个问题。 闭包简介 闭包是JavaScript的重要特性,那么什么是闭包? 《JavaScript高级程序设计(第3版)》中闭包的定义: 闭包就是指有权访问另一个函数中的变...

    Donne 评论0 收藏0
  • 深入javascript——作用域和闭包

    摘要:注意由于闭包会额外的附带函数的作用域内部匿名函数携带外部函数的作用域,因此,闭包会比其它函数多占用些内存空间,过度的使用可能会导致内存占用的增加。 作用域和作用域链是javascript中非常重要的特性,对于他们的理解直接关系到对于整个javascript体系的理解,而闭包又是对作用域的延伸,也是在实际开发中经常使用的一个特性,实际上,不仅仅是javascript,在很多语言中都...

    oogh 评论0 收藏0
  • Javascript闭包入门(译文)

    摘要:也许最好的理解是闭包总是在进入某个函数的时候被创建,而局部变量是被加入到这个闭包中。在函数内部的函数的内部声明函数是可以的可以获得不止一个层级的闭包。 前言 总括 :这篇文章使用有效的javascript代码向程序员们解释了闭包,大牛和功能型程序员请自行忽略。 译者 :文章写在2006年,可直到翻译的21小时之前作者还在完善这篇文章,在Stackoverflow的How do Java...

    Fourierr 评论0 收藏0

发表评论

0条评论

wqj97

|高级讲师

TA的文章

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