zoukankan      html  css  js  c++  java
  • 闭包

    闭包的引入

    我们知道,变量根据作用域的不同分为两种:全局变量和局部变量。

    • 函数内部可以访问全局变量和局部变量。

    • 函数外部只能访问全局变量,不能访问局部变量。

    • 当函数执行完毕,本作用域内的局部变量会销毁。

    比如下面这样的代码:

    function foo() {
        let a = 1;
    }
    
    foo();
    console.log(a); // 打印报错:Uncaught ReferenceError: a is not defined
    

    上方代码中,由于变量 a 是函数内的局部变量,所以外部无法访问。

    但是,在有些场景下,我们就是想要在函数外部访问函数内的局部变量,那要怎么办呢?这就需要引入闭包的概念。

    闭包的概念和代码举例

    闭包的概念

    闭包(closure):指有权访问另一个函数作用域中变量函数

    上面这个概念,出自《JavaScript 高级程序设计(第 3 版)》这本书。上面的概念中指出,闭包是一种函数;当然,你可以把闭包理解成是一种现象。具体解释如下。

    简单理解就是:如果这个作用域可以访问另外一个函数内部的局部变量,那就产生了闭包(此时,你可以把闭包理解成是一种现象);而另外那个作用域所在的函数称之为闭包函数。注意,这里强调的是访问局部变量哦。

    闭包代码举例

    代码举例:

    function fn1() {
        var a = 10;
        function fn2() {
            console.log(a);
        }
        fn2();
    }
    fn1();
    

    打印结果:

    10
    

    上方代码中,函数 fn2 的作用域 访问了 fn1 中的局部变量,那么,此时在 fn1 中就产生了闭包,fn1 称之为闭包函数。

    在 chrome 浏览器控制台中,调试闭包

    上面的代码中,要怎么验证,确实产生了闭包呢?我们可以在 chrome 浏览器的控制台中设置断点,当代码执行到 console.log(a)这一行的时候,如下图所示:

    上图中, Local 指的是局部作用域,Global 指的是 全局作用域;而 Closure 则是闭包,fn1 是一个闭包函数。

    闭包的作用:延伸变量的作用范围

    我们来看看下面这段闭包的代码:

    function fn1() {
        var a = 20;
        function fn2() {
            console.log(a);
        }
        return fn2;
    }
    
    var foo = fn1(); // 执行 fn1() 之后,会得到一个返回值。foo 代表的就是 fn2 函数
    foo();
    

    上方代码中,foo 代表的就是整个 fn2 函数。当执行了 foo() 语句之后(相当于执行了 ),fn1 函数内就产生了闭包。

    一般来说,在 fn1 函数执行完毕后,它里面的变量 a 会立即销毁。但此时由于产生了闭包,所以 fn1 函数中的变量 a 不会立即销毁,因为 fn2 函数还要继续调用变量 a。只有等所有函数把变量 a 调用完了,变量 a 才会销毁。

    而且,可以看出, 在执行 foo()语句之后,竟然能够打印出 20,这就完美通过闭包实现了:全局作用局成功访问到了局部作用域中的变量 a。

    因此,我们可以看出,闭包的主要作用就是:延伸了变量的作用范围。

    上面的代码也可以简写成:

    function fn1() {
        var a = 20;
        return function () {
            console.log(a);
        };
    }
    var foo = fn1(); // 执行 fn1() 之后,会得到一个返回值。这个返回值是函数
    foo();
    

    补充:

    闭包的优点:1.能够读取函数内部的变量 2.让这些变量一直存在于内存中,不会在调用结束后,被垃圾回收机制回收

    闭包的缺点:正所谓物极必反,由于闭包会使函数中的变量保存在内存中,内存消耗很大,所以不能滥用闭包,解决办法是,退出函数之前,将不使用的局部变量删除。

  • 相关阅读:
    java.lang.NoSuchMethodError: org.springframework.beans.factory.annotation.InjectionMetadata.<init>(Ljava/lang/Class;)V
    tomcat下jndi的三种配置方式
    使用@RequestParam绑定请求参数到方法参数
    IE下easyui 缓存问题
    many to one could not resolve property
    aop郁闷错误
    Spring 运用 pointcut 和 advisor 对特定的方法进行切面编程
    放大改进版~
    cocos2d-x嵌入移动MM短代支付IAP2.4的SDK,点击支付崩溃的解决的方法
    在 Android* 商务应用中实施地图和地理围栏特性
  • 原文地址:https://www.cnblogs.com/yuanliy/p/14551302.html
Copyright © 2011-2022 走看看