图解闭包

时间 2019-11-19

标签图解闭包繁體版

原文原文链接

说到闭包，这是js不得不提的一个特性，不少传统语言都不具有这样的特性，好比JAVA C等等。javascript

以前看书的时候，老是理解很差什么是闭包！下面就经过手绘一张原理图，来理解一下：html

　　首先基本上全部的编程语言都有相似的特性，局部方法能够访问外部父类方法的属性，也就是说，子类或子方法能够访问父类的资源。java

<!-- 在正常的脚本中，某个方法能够获取到外部的变量，或者全局变量 -->
        var num = 11; function func1(){ console.log(num); } func1();

　　所以上面的这段代码，咱们能够获取到num的值。编程

　　父类可否获取到子方法内部的值呢？闭包

function func2(){ var num1 = 22; num2 = 33; } func2(); <!--console.log(num1);  会报错！--> console.log(num2); <!--能够获取到num2的值，由于不使用var定义变量时，默认是全局变量 -->

　　固然是不能够的，由于子方法的变量做用域仅仅是子方法的范围，外部是没法获取到的。编程语言

　　那么如何才能在外部获取到子方法的局部变量呢！性能

　　若是是java，一个类的私有属性，能够经过公共的get方法来获取，好比：spa

class Person{ private String name; public String getName(){ return name; } }

　　经过上面的方式能够获取到一个类内部的私有属性，一样的，在js中能够经过某个方法来获取这个方法的局部变量，而后经过这个方法内的方法来读取想要的变量值。code

function func3(){ var num3 = 44; function func4(){ return num3; } return func4; } var func = func3(); console.log(func());

　　参考下面的图解：htm

　　在外部没法获取到func3内部的局部变量，可是func3内部的局部方法func4却能够获取到，所以 返回一个func4的引用 ，这样在外部经过这个func4就能够获取到func3的内部变量。

　　虽然是绕了一个圈子，可是在方法外部却经过这样一个手段获取到了内部的值。

　　而这个方法内的局部方法func4就叫作闭包，按照不少书上的概念，这个方法搭建了方法内部与方法外部的桥梁，使得在外部也能够任意的获取到方法内部的资源。

　　可是闭包会形成变量在内存中持久占用，所以会有必定的性能问题，最好不要轻易使用，即使使用也要在恰当的实际进行释放。

　　示例的源码：

<!doctype html>
<html>
    <head>
    </head>
    <body>
        <script type="text/javascript">
        <!-- 在正常的脚本中，某个方法能够获取到外部的变量，或者全局变量 -->
        var num = 11; function func1(){ console.log(num); } func1(); <!-- 可是在外部是没法获取方法内部的局部变量的 -->
        function func2(){ var num1 = 22; num2 = 33; } func2(); <!--console.log(num1);  会报错！--> console.log(num2); <!--能够获取到num2的值，由于不适用var定义变量时，默认是全局变量 -->

        <!-- 那么如何在外部获取到内部的变量呢！javascript能够办到 -->
        function func3(){ var num3 = 44; function func4(){ return num3; } return func4; } var func = func3(); console.log(func()); </script>
    </body>
</html>

　　运行结果：