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();

復制代碼

就很簡單,就是之前的代碼稍微改動下就可以了。相關理解也在上面說的很清楚啦,可以仔細看看應該是能明白的。