1. 程式人生 > >閉包與私有變量

閉包與私有變量

undefined return fun document AC urn 賦值 點擊 style

看了高程之後知道閉包可以用於創建私有變量,但是對於私有變量仍然不是很懂,後來看了單頁Web應用這本書之後,對於私有變量有了更深入的理解,這裏小小總結一下。

閉包

閉包這裏就不多啰嗦了,相信大家都有一定的了解了,可以理解成A函數裏面套了一個B函數,而B函數可以訪問到A函數裏面的變量

來個例子!

其實除了私有變量之外相應的也就有私有函數公有函數,下面會放在一起講

用一個的例子來說明更為明顯:

    <body>
        <button id="btn">加1</button>
        <script>
            var
fn = function(){ var a, btn = document.getElementById(btn), addNumber,getNumber,setNumber, init; setNumber = function(){ a = 1; }; getNumber
= function(){ return a; }; addNumber = function(){ a++; console.log(a); }; init = function(){ setNumber(); btn.onclick = function(){ addNumber(); }; };
return { getNum : getNumber, init : init }; }; var F = fn(); </script> </body>

首先四個函數都使用了閉包,所以他們都可以訪問到F的私有變量a,其中getNuminit是公有函數,addNumsetNumber是私有函數

我們先來看一下測試的結果:

技術分享圖片

可以看到一開始a的值是沒有賦值的,所以F.getNum()得到的undefined

經過初始化之後,a的值被賦為了1,同時我們還綁定的點擊事件

再次執行F.getNum()我們獲得了a的值

點擊三次按鈕之後a的值變為了4

再次執行F.getNum()進行驗證,發現a的值的確變成了4.。

私有變量a

為什麽說a是私有變量呢?因為你無法從外界訪問到變量a,但是這也太常見了,只要是個函數就都會有私有變量,有什麽稀奇的,嗯,所以我認為主要還是公有函數和私有函數起著更大的作用

私有函數

同理,因為函數是私有的,所以你沒有辦法直接訪問到它,也就沒有辦法從外部來修改它,它可以去執行某些操作,但想要它起作用就要通過公有函數來調用它

公有函數

如上述代碼所示我們最後return 出來的就是公有函數,它是可以通過外界來直接調用的函數,你可以選擇在return裏面放哪些函數。比如這裏我不希望別人直接來改我的私有變量的值,我就可以選擇不把setNumber放進來,你想改變a的值就只能去一個一個的點按鈕。

通過調用公有函數我們可以去訪問或改變私有變量的值,也可以去調用私有函數,比如這裏我們通過getNumber訪問到了a的值,又通過init初始化了a的值同時綁定了點擊事件,使得每一次點擊按鈕的時候我們都可以調用addNumber這個私有函數。

閉包的作用

在這個過程中,因為fn返回了一個對象,對象中包含著內部的函數,並且這個函數還訪問了內部的變量,導致F的整個變量對象一直被保存在內存之中,所以其中的私有變量,私有函數我們都還可以訪問到。

閉包與私有變量