半個月沒寫博文了,最近一直在弄小程序,感覺也沒啥好寫的。
之前讀了js權威指南,也寫了篇博文,但是實話實說當初看閉包確實還是一頭霧水。現在時隔一個多月(當然這一段時間還是一直有在看閉包的相關知識)理解就更深入了一點,下面說說我的理解。
1 function fn(){ 2 var a = 0; 3 return function (){ 4 return ++a; 5 } 6 }
如上所示,上面第一個return返回的就是一個閉包,那么本質上說閉包就是一個函數。那么返回這個函數有什么用呢?
那是因為這個函數可以調用到它外部的a這個變量。其實也就是說,return返回的是這個函數 + a這個變量
那么,我們現在再來利用這個閉包做點事情
我們不妨創建一個變量 var f = fn(); 我們如果 console.log(f) 一下就知道,這個f就是return的整個函數體,也就是 function () { return ++a;}
那么我們執行f()就相當於執行function函數了,這時,我們多次執行f()的話,返回的a數值就會一直疊加。
但是如果我們現在再創建一個變量 var f2 = fn(); 我們運行f2()的話,會發現,a的值重置了。又會從0開始了。這是為什么呢?
其實我們可以這樣理解,首先閉包是一個匿名函數,現在我們將它賦予了一個變量,那么他就有名字了,那么他每次執行完以后就有地方存了。但是每個變量存的地方又不一樣,他們相互不關聯,所以他們就是獨立的個體了,所以a得值就不同了。就當是執行了不同的函數,只是恰好函數體是一樣的罷了。
非常感謝這篇博文提供的思路
那么,我們閉包的應用場景有什么呢。本來之前我也一直在想,因為我很水,所以我寫代碼用到閉包的地方並不是很多。但是今天在看前端的設計模式的時候看到了單例模式,想了下,這不就是閉包的一個很好的應用場景么?
比如說我現在的需求是這樣的,在網頁中有時候會需要遮罩層,調用的時候我就創建一個,但是你不可能每次調用創建吧,所以如果存在就用以前的,如果不存在就創建新的,但同時有可能我永遠都不需要這個遮罩層,所以我也有可能一直都不需要創建。
這就是一個很典型的單例模式的場景。
那么我們怎么來實現呢。
1 function fn() { 2 var a; 3 return function() { 4 return a || (a = document.body.appendChild(document.createElement('div'))); 5 } 6 }; 7 var f = fn(); 8 f();
就很簡單,就是之前的代碼稍微改動下就可以了。相關理解也在上面說的很清楚啦,可以仔細看看應該是能明白的。
好了,現在對閉包算是有了一點點深入的理解了。接下來還是要繼續慢慢的深入,博主也會及時更新的。