閉包,關(guān)于閉包用途

1. JS中變量的作用域

在理解閉包之前遭铺,我們得弄清楚JS中變量的作用域原理,它分為全局作用域和局部作用域恢准,它有一個(gè)特點(diǎn)就是局部可以獲取全局的聲明變量魂挂,而全局卻不能得到局部聲明的變量,我們先來看一個(gè)小例子:

                                     var num = 1902;

                                     function methods() {

                                       var qty = 25;

                                       console.log(num);

                                     }

                                     methods();  // 1902
  
                                     console.log(qty);  // 報(bào)錯(cuò)馁筐,找不到 qty 變量;

當(dāng)然在局部聲明變量的時(shí)候一定要用var或者let涂召,不然會(huì)在全局生成一個(gè)變量,容易照成全局污染敏沉,上面代碼如果qty沒有var聲明:

                                    var num = 1902;

                                    function methods() {

                                        qty = 25;

                                        console.log(num);

                                     }

                                     methods();  // 1902;

                                     console.log(qty);  // 25;

2.什么是閉包

那么現(xiàn)在問題來了芹扭,如果我們非要從外部來讀取局部變量中的聲明變量呢,尋常方式不行赦抖,我們可以變通一下舱卡,就是在函數(shù)內(nèi)部再嵌套一個(gè)函數(shù),然后返回這個(gè)嵌套函數(shù):

                                           function methods() {

                                                 var qty = 25;

                                                 return function num() {

                                                 console.log(qty);

                                                }
  
                                             }

                                            var num1 = methods();

                                            num1()  // 25

這樣队萤,控制臺(tái)就會(huì)打印出 qty 變量的值了轮锥,其實(shí)在上面的代碼中,被返回的函數(shù) num()就產(chǎn)生了閉包要尔,由于在js中舍杜,只有函數(shù)內(nèi)部的子函數(shù)才能讀取局部變量,所以可以把閉包理解成定義在一個(gè)函數(shù)內(nèi)部的函數(shù)赵辕,簡(jiǎn)單的說既绩,JavaScript允許使用內(nèi)部函數(shù):即函數(shù)定義和函數(shù)表達(dá)式位于另一個(gè)函數(shù)的函數(shù)體內(nèi)而且,這些內(nèi)部函數(shù)可以訪問它們所在的外部函數(shù)中聲明的所有局部變量还惠、參數(shù)和聲明的其他內(nèi)部函數(shù)饲握。當(dāng)其中一個(gè)這樣的內(nèi)部函數(shù)在包含它們的外部函數(shù)之外被調(diào)用時(shí),就會(huì)形成閉包蚕键。

3.閉包的用途

我們接著探討閉包的表達(dá)形式以及用途救欧。
(1)匿名自執(zhí)行函數(shù)

                                         (function () {
                                            var methods = function () {
                                                console.log('執(zhí)行完函數(shù)后銷毀')
                                            };
                                            methods();
                                        })();

上面代碼也是閉包的應(yīng)用,運(yùn)用于函數(shù)只會(huì)執(zhí)行一次的場(chǎng)景锣光,執(zhí)行完便會(huì)被釋放笆怠。
(2)給對(duì)象設(shè)置私有變量

                                      var result = function () {
                                             var count = 1;
                                             return function () {
                                                  count++;
                                                  console.log(count)
                                              }
                                        }()
                                          result(); // 2
                                          result(); // 3
                                          result(); // 4
                                          result(); // 5

上面代碼可以保存自己的私有變量,防止代碼之間的沖突誊爹。
(3)異步執(zhí)行函數(shù)
下面先看一個(gè)小例子:

                                      for (var i = 0; i < 5; i++) {
                                              console.log(i);  //0蹬刷,1瓢捉,2,3办成,4
                                      }
                                      for (var i = 0; i < 5; i++) {
                                             setTimeout(() => {
                                                     console.log(i); //5泊柬,5,5诈火,5兽赁,5
                                            }, 0)
                                      }

為什么會(huì)出現(xiàn)上述差異呢,原因在于setTimeout是異步加載冷守,所以為先循環(huán)結(jié)束后輸出最后結(jié)果刀崖,如果我們就是想實(shí)現(xiàn)輸出0,1拍摇,2亮钦,3,4呢充活。那就要用到閉包了:

                                          for (var i = 0; i < 5; i++) {
                                                (function (i) {
                                                      setTimeout(() => {
                                                            console.log(i); //0蜂莉,1,2混卵,3映穗,4
                                                      }, 0);
                                                })(i);
                                            }

上面就是異步調(diào)用閉包,它可以讓變量值始終保存在內(nèi)存中幕随,即使外部的執(zhí)行環(huán)境已經(jīng)結(jié)束了蚁滋。

4.閉包的優(yōu)缺點(diǎn)

(1)由于閉包會(huì)使得函數(shù)中的變量都被保存在內(nèi)存中,內(nèi)存消耗很大赘淮,所以不能濫用閉包辕录,否則會(huì)造成網(wǎng)頁(yè)的性能問題,在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閱讀 222,807評(píng)論 6 518
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異窄潭,居然都是意外死亡春宣,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,284評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門嫉你,熙熙樓的掌柜王于貴愁眉苦臉地迎上來月帝,“玉大人,你說我怎么就攤上這事幽污∪赂ǎ” “怎么了?”我有些...
    開封第一講書人閱讀 169,589評(píng)論 0 363
  • 文/不壞的土叔 我叫張陵距误,是天一觀的道長(zhǎng)簸搞。 經(jīng)常有香客問我,道長(zhǎng)准潭,這世上最難降的妖魔是什么趁俊? 我笑而不...
    開封第一講書人閱讀 60,188評(píng)論 1 300
  • 正文 為了忘掉前任,我火速辦了婚禮刑然,結(jié)果婚禮上则酝,老公的妹妹穿的比我還像新娘。我一直安慰自己闰集,他們只是感情好沽讹,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,185評(píng)論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著武鲁,像睡著了一般爽雄。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上沐鼠,一...
    開封第一講書人閱讀 52,785評(píng)論 1 314
  • 那天挚瘟,我揣著相機(jī)與錄音,去河邊找鬼饲梭。 笑死乘盖,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的憔涉。 我是一名探鬼主播订框,決...
    沈念sama閱讀 41,220評(píng)論 3 423
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼兜叨!你這毒婦竟也來了穿扳?” 一聲冷哼從身側(cè)響起衩侥,我...
    開封第一講書人閱讀 40,167評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎矛物,沒想到半個(gè)月后茫死,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,698評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡履羞,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,767評(píng)論 3 343
  • 正文 我和宋清朗相戀三年峦萎,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片忆首。...
    茶點(diǎn)故事閱讀 40,912評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡骨杂,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出雄卷,到底是詐尸還是另有隱情搓蚪,我是刑警寧澤,帶...
    沈念sama閱讀 36,572評(píng)論 5 351
  • 正文 年R本政府宣布丁鹉,位于F島的核電站妒潭,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏揣钦。R本人自食惡果不足惜雳灾,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,254評(píng)論 3 336
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望冯凹。 院中可真熱鬧谎亩,春花似錦、人聲如沸宇姚。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,746評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)浑劳。三九已至阱持,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間魔熏,已是汗流浹背衷咽。 一陣腳步聲響...
    開封第一講書人閱讀 33,859評(píng)論 1 274
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留蒜绽,地道東北人镶骗。 一個(gè)月前我還...
    沈念sama閱讀 49,359評(píng)論 3 379
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像躲雅,于是被迫代替她去往敵國(guó)和親鼎姊。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,922評(píng)論 2 361

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