js中閉包的理解、用途場(chǎng)景恭陡、優(yōu)缺點(diǎn)及解決辦法

一蹬音、閉包的含義

官方對(duì)閉包的解釋?zhuān)阂粋€(gè)擁有許多變量和綁定了這些變量的環(huán)境的表達(dá)式(通常是一個(gè)函數(shù)),因而這些變量也是該表達(dá)式的一部分休玩。

二著淆、閉包的特點(diǎn):
  1. 作為一個(gè)函數(shù)變量的一個(gè)引用,當(dāng)函數(shù)返回時(shí)拴疤,其處于激活狀態(tài)永部。
  2. 一個(gè)閉包就是當(dāng)一個(gè)函數(shù)返回時(shí),一個(gè)沒(méi)有釋放資源的棧區(qū)遥赚。
    簡(jiǎn)單的閉包如下:
    function f1(){
    var n = 100;
    return function f2(){
    alert(++n);
    }
    }
函數(shù)執(zhí)行時(shí)創(chuàng)建了一個(gè)內(nèi)部函數(shù)扬舒,這個(gè)內(nèi)部函數(shù)作為返回值,或以某種方式保留下來(lái)(屬性)凫佛,之后才會(huì)調(diào)用讲坎,這就會(huì)形成了閉包。通俗來(lái)講愧薛,JS所有的function都是一個(gè)閉包晨炕。

三、用途場(chǎng)景
  1. 匿名自執(zhí)行函數(shù)
    我們創(chuàng)建了一個(gè)匿名的函數(shù)毫炉,并立即執(zhí)行它瓮栗,由于外部無(wú)法引用它內(nèi)部的變量,因此在函數(shù)執(zhí)行完后會(huì)立刻釋放資源瞄勾,關(guān)鍵是不污染全局對(duì)象费奸。
    代碼如下:
    (function() {
    var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
    today = new Date(),
    msg = 'Today is ' + days[today.getDay()] + ', ' + today.getDate();
    alert(msg);
    } ());

  2. 結(jié)果緩存

    我們開(kāi)發(fā)中會(huì)碰到很多情況,設(shè)想我們有一個(gè)處理過(guò)程很耗時(shí)的函數(shù)對(duì)象进陡,每次調(diào)用都會(huì)花費(fèi)很長(zhǎng)時(shí)間愿阐,那么我們就需要將計(jì)算出來(lái)的值存儲(chǔ)起來(lái),當(dāng)調(diào)用這個(gè)函數(shù)的時(shí)候趾疚,首先在緩存中查找缨历,如果找不到以蕴,則進(jìn)行計(jì)算,然后更新緩存并返回值辛孵,如果找到了丛肮,直接返回查找到的值即可。閉包正是可以做到這一點(diǎn)魄缚,因?yàn)樗粫?huì)釋放外部的引用宝与,從而函數(shù)內(nèi)部的值可以得以保留。
    var CachedSearchBox = (function(){
    var cache = {},
    count = [];
    return {
    attachSearchBox : function(dsid){
    if(dsid in cache){//如果結(jié)果在緩存中
    return cache[dsid];//直接返回緩存中的對(duì)象
    }
    var fsb = new uikit.webctrl.SearchBox(dsid);//新建
    cache[dsid] = fsb;//更新緩存
    if(count.length > 100){//保正緩存的大小<=100
    delete cache[count.shift()];
    }
    return fsb;
    },

           clearSearchBox : function(dsid){    
                if(dsid in cache){    
                cache[dsid].clearSelection();      
                }    
           }    
        };    
    })();
    
  3. 封裝
    var person = function(){
    //變量作用域?yàn)楹瘮?shù)內(nèi)部鲜滩,外部無(wú)法訪(fǎng)問(wèn)
    var name = "default";
    return {
    getName : function(){
    return name;
    },
    setName : function(newName){
    name = newName;
    }
    }
    }();

  4. 實(shí)現(xiàn)類(lèi)和繼承
    function Person(){
    var name = "default";
    return {
    getName : function(){
    return name;
    },
    setName : function(newName){
    name = newName;
    }
    }
    };

    var p = new Person();
    p.setName("Tom");
    alert(p.getName());//Tom
    
    var Jack = function(){};
    //繼承自Person
    Jack.prototype = new Person();
    //添加私有方法
    Jack.prototype.Say = function(){
        alert("Hello,my name is Jack");
    };
    var j = new Jack();
    j.setName("Jack");
    j.Say();
    alert(j.getName());//Jack
    

四伴鳖、優(yōu)缺點(diǎn)
  • 優(yōu)點(diǎn)
    1.可以讀取函數(shù)內(nèi)部的變量
    2.可以讓這些局部變量保存在內(nèi)存中节值,實(shí)現(xiàn)變量數(shù)據(jù)共享徙硅。
  • 缺點(diǎn)
    1.由于閉包會(huì)使得函數(shù)中的變量都被保存在內(nèi)存中,內(nèi)存消耗很大搞疗,所以不能濫用閉包嗓蘑,否則會(huì)造成網(wǎng)頁(yè)的性能問(wèn)題,在IE中可能導(dǎo)致內(nèi)存泄露匿乃。解決方法是桩皿,在退出函數(shù)之前泄隔,將不使用的局部變量全部刪除。
    2.閉包會(huì)在父函數(shù)外部,改變父函數(shù)內(nèi)部變量的值。所以,如果你把父函數(shù)當(dāng)作對(duì)象(object)使用戚揭,把閉包當(dāng)作它的公用方法(Public Method)蔬啡,把內(nèi)部變量當(dāng)作它的私有屬性(private value),這時(shí)一定要小心,不要隨便改變父函數(shù)內(nèi)部變量的值辈毯。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末唁影,一起剝皮案震驚了整個(gè)濱河市饺蔑,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,948評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件拇涤,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡誉结,警方通過(guò)查閱死者的電腦和手機(jī)鹅士,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,371評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)惩坑,“玉大人掉盅,你說(shuō)我怎么就攤上這事也拜。” “怎么了趾痘?”我有些...
    開(kāi)封第一講書(shū)人閱讀 157,490評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵慢哈,是天一觀(guān)的道長(zhǎng)。 經(jīng)常有香客問(wèn)我永票,道長(zhǎng)卵贱,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,521評(píng)論 1 284
  • 正文 為了忘掉前任侣集,我火速辦了婚禮键俱,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘世分。我一直安慰自己编振,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,627評(píng)論 6 386
  • 文/花漫 我一把揭開(kāi)白布罚攀。 她就那樣靜靜地躺著党觅,像睡著了一般雌澄。 火紅的嫁衣襯著肌膚如雪斋泄。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 49,842評(píng)論 1 290
  • 那天镐牺,我揣著相機(jī)與錄音炫掐,去河邊找鬼。 笑死睬涧,一個(gè)胖子當(dāng)著我的面吹牛募胃,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播畦浓,決...
    沈念sama閱讀 38,997評(píng)論 3 408
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼痹束,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了讶请?” 一聲冷哼從身側(cè)響起祷嘶,我...
    開(kāi)封第一講書(shū)人閱讀 37,741評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎夺溢,沒(méi)想到半個(gè)月后论巍,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,203評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡风响,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,534評(píng)論 2 327
  • 正文 我和宋清朗相戀三年嘉汰,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片状勤。...
    茶點(diǎn)故事閱讀 38,673評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡鞋怀,死狀恐怖双泪,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情密似,我是刑警寧澤攒读,帶...
    沈念sama閱讀 34,339評(píng)論 4 330
  • 正文 年R本政府宣布,位于F島的核電站辛友,受9級(jí)特大地震影響薄扁,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜废累,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,955評(píng)論 3 313
  • 文/蒙蒙 一邓梅、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧邑滨,春花似錦日缨、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,770評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至哎壳,卻和暖如春毅待,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背归榕。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,000評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工尸红, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人刹泄。 一個(gè)月前我還...
    沈念sama閱讀 46,394評(píng)論 2 360
  • 正文 我出身青樓外里,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親特石。 傳聞我的和親對(duì)象是個(gè)殘疾皇子盅蝗,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,562評(píng)論 2 349

推薦閱讀更多精彩內(nèi)容

  • 工廠(chǎng)模式類(lèi)似于現(xiàn)實(shí)生活中的工廠(chǎng)可以產(chǎn)生大量相似的商品,去做同樣的事情姆蘸,實(shí)現(xiàn)同樣的效果;這時(shí)候需要使用工廠(chǎng)模式墩莫。簡(jiǎn)單...
    舟漁行舟閱讀 7,726評(píng)論 2 17
  • 三、閉包和高階函數(shù) 3.1 閉包 3.1.1 變量的作用域 所謂變量的作用域乞旦,就是變量的有效范圍贼穆。通過(guò)作用域的劃分...
    梁同學(xué)de自言自語(yǔ)閱讀 1,448評(píng)論 0 6
  • 閉包(closure)是Javascript語(yǔ)言的一個(gè)難點(diǎn),也是它的特色兰粉,很多高級(jí)應(yīng)用都要依靠閉包實(shí)現(xiàn)故痊。 一、變量...
    zock閱讀 1,075評(píng)論 2 6
  • 單例模式 適用場(chǎng)景:可能會(huì)在場(chǎng)景中使用到對(duì)象玖姑,但只有一個(gè)實(shí)例愕秫,加載時(shí)并不主動(dòng)創(chuàng)建慨菱,需要時(shí)才創(chuàng)建 最常見(jiàn)的單例模式,...
    Obeing閱讀 2,058評(píng)論 1 10
  • @轉(zhuǎn)自GitHub 介紹js的基本數(shù)據(jù)類(lèi)型戴甩。Undefined符喝、Null、Boolean甜孤、Number协饲、Strin...
    YT_Zou閱讀 1,145評(píng)論 0 0