什么是閉包

對于初次步入代碼界的小朋友們,聽說閉包這個詞,感覺摸不著頭腦,所以本人親自整理了一下理解閉包的思路,本文主要是從三個反面闡述了閉包:1,什么是閉包;2閉包的好處以及應用;3,使用閉包需要注意什么。別的不多說了,直接上碼。

一,什么是閉包?

定義:函數嵌套函數,內部函數可以引用外部函數的參數和變量,變量和參數不會被垃圾回收機制所回收

例1:這是一個比較明顯的閉包

function show(a){ //外面的函數 a是參數(實質也是函數show的局部變量)

var b=12;//b是局部變量

function show1(){//里面的函數

console.log(a); //=》2 //里面的函數可以訪問到外面函數的參數和變量

console.log(b); //=》12

}

show1();

}

show(2);

例2:解釋一下垃圾回收機制

function aaa(){

var a=12;//a是局部變量

alert(a);

a++;

}

aaa();//=》 12

aaa();//=》 12

//執行2次aaa函數,彈出的結果都是12,說明變量a每執行一次,都會被垃圾回收機制所回收,重新調用的時候就會重新執行初始的代碼,如果寫成閉包的形式再來看一下:

function aaa(){

var a=12;

return function(){

alert(a);

a++;

}

}

var b=aaa();

b();//=》 12

b();//=》 13

//定義函數aaa的時候,形成了函數嵌套函數的閉包,其中的變量a在第一次執行b的時候不會被垃圾回收機制所回收,所以第一次出來結果是12,然后在此基礎是a++,再次執行時就變成了13。這個例子也說明的閉包的第一個好處,希望一個變量長期駐扎在內存之中

二,閉包有什么好處,應用在哪里

1,希望一個變量長期駐扎在內存之中(見例2)

2,避免全局變量的污染

例3:我們先來寫個全局變量,然后定義一個函數試一試

var a=12;

function show(){

alert(a);

a++;

}

show();//=》 12

show();//=》 13

alert(a);//全局變量最后變成了=》 14,顯然全局變量被污染了。

我們在寫成閉包的形式來看一下:

var a=12;

var b=(function(i){

return function(){

alert(i);

i++;

}

})(a)

b();//=》 12

b();//=》 13

alert(a);//全局變量依然是=》 12,沒有被污染

3,私有成員的存在

例4:

function show(){

var a=12;

function show1(){

alert(a);

a++;

}

function show2(){

alert(a);

a++;

}

return {show1:show1,show2:show2};

}

var b=show();//調用函數的返回值

b.show1();//=》 12

b.show2();//=》 13 兩次執行都是調用變量他們公共的變量a

alert(a)//報錯

alert(show1)//報錯

alert(show2)//報錯

//在這里需要知道函數本質其實是一個特殊的對象,函數里面的變量a,定義的函數show1和show2,都屬于函數的私有成員,在外面訪問不到會報錯。

應用:例2中的(function(){})()形式,就是閉包的一個典型的影響,我們可以稱作是封閉空間,也可說是模塊化代碼

三,使用閉包需要注意什么

使用有可能出現內存泄漏,在這里只是簡單說一下原理

例5:

window.onload=function(){

var oBtn=document.getElementById('btn');

oBtn.onclick=function(){

alert(oBtn.id)//btn

}

}

//此種形式也形成了函數嵌套函數的閉包形式,點擊按鈕oBtn的時候,變量oBtn的點擊事件得不到釋放,影響cpu的性能,導致內存泄漏,這個時候可以點擊之后,加oBtn.onclick=null;是變量oBtn的點擊時候得到釋放

注,閉包貫穿整個js,如果想徹底理解閉包很難,所以想深入理解閉包需要在工作中長期的沉淀積累,如果各位大神有更好的理解方式可以留言,我們共同探討

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,791評論 6 545
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,795評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事?!?“怎么了?”我有些...
    開封第一講書人閱讀 178,943評論 0 384
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 64,057評論 1 318
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,773評論 6 414
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,106評論 1 330
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,082評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,282評論 0 291
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,793評論 1 338
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,507評論 3 361
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,741評論 1 375
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,220評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,929評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,325評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,661評論 1 296
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,482評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,702評論 2 380

推薦閱讀更多精彩內容

  • 《ijs》速成開發手冊3.0 官方用戶交流:iApp開發交流(1) 239547050iApp開發交流(2) 10...
    葉染柒丶閱讀 5,275評論 0 7
  • 閉包(closure)是Javascript語言的一個難點,也是它的特色,很多高級應用都要依靠閉包實現。 一、變量...
    zock閱讀 1,078評論 2 6
  • 第一章: JS簡介 從當初簡單的語言,變成了現在能夠處理復雜計算和交互,擁有閉包、匿名函數, 甚至元編程等...
    LaBaby_閱讀 1,689評論 0 6
  • 凌晨三點, 雨好大, 打濕了我抱在壞里的泡面, 最近好像一直都很忙, 并沒有留下只言片語, 堅持。
    有童年沒青春閱讀 207評論 0 0
  • 靜靜地看著這些布偶,在這個快速繁雜的世界有時候簡單是多么的奢侈。
    萬圣節的魔棒閱讀 192評論 0 0