圖解閉包

時間 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>

　　運行結果：

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。