2018-09-12 對阮一峰大佬《學習Javascript閉包(Closure)》的學習整理

阮一峰大佬的文章

  • 1. 什么是閉包云茸?

    我的理解是,閉包就是能夠讀取其他函數內部變量的函數妹萨。
    由于在Javascript語言中年枕,只有函數內部的子函數才能讀取局部變量,因此可
    以把閉包簡單理解成"定義在一個函數內部的函數"乎完。

  • 2. 閉包的用途

    • 可以讀取函數內部的變量

      簡單來說JS語言具備的特點之一熏兄,即子函數可以獲取全局變量,而函數外部無法獲取到函數內的局部變量树姨,在某些特定的情況下我們需要獲取函數內部的局部變量即可通過一些變通的方法達成目的摩桶。

       function f1(){
            var n=999;
          function f2(){ 
            alert(n); // 999
          }
        }
      

      Javascript語言特有的"鏈式作用域"結構(chain scope),子對象會一級一級地向上尋找所有父對象的變量帽揪。所以硝清,父對象的所有變量,對子對象都是可見的转晰,反之則不成立芦拿。

      因此利用JS語言的此種特性,
      在目標函數內部定義一個函數就可以目標函數的局部變量暴露出來

    • 讓這些變量的值始終保持在內存中

      還是上大佬的栗子

      function f1(){
        var n=999;
        nAdd=function(){n+=1}
        function f2(){
            alert(n);
        }
        return f2;
      }
      var result=f1();
      result(); // 999
      nAdd();
      result(); // 1000
      

      在這段代碼中挽霉,result實際上就是閉包f2函數防嗡。它一共運行了兩次,第一次的值是999,第二次的值是1000。這證明了干发,函數f1中的局部變量n一直保存在內存中,并沒有在f1調用后被自動清除他嫡。
      為什么會這樣呢?原因就在于f1是f2的父函數庐完,而f2被賦給了一個全局變量钢属,這導致f2始終在內存中,而f2的存在依賴于f1门躯,因此f1也始終在內存中淆党,不會在調用結束后,被垃圾回收機制(garbage collection)回收讶凉。
      這段代碼中另一個值得注意的地方染乌,就是"nAdd=function(){n+=1}"這一行,首先在nAdd前面沒有使用var關鍵字懂讯,因此nAdd是一個全局變量荷憋,而不是局部變量。其次褐望,nAdd的值是一個匿名函數(anonymous function)勒庄,而這個匿名函數本身也是一個閉包串前,所以nAdd相當于是一個setter,可以在函數外部對函數內部的局部變量進行操作实蔽。

  • 3. 使用閉包需要注意的點

    1)由于閉包會使得函數中的變量都被保存在內存中荡碾,內存消耗很大,所以不能濫用閉包局装,否則會造成網頁的性能問題玩荠,在IE中可能導致內存泄露。解決方法是贼邓,在退出函數之前,將不使用的局部變量全部刪除闷尿。

    2)閉包會在父函數外部塑径,改變父函數內部變量的值。所以填具,如果你把父函數當作對象(object)使用统舀,把閉包當作它的公用方法(Public Method),把內部變量當作它的私有屬性(private value)劳景,這時一定要小心誉简,不要隨便改變父函數內部變量的值。

  • 4. 阮一峰大佬的思考題 1

題目


image.png

最終輸出結果是The Window

下面強行分析一波

alert輸出 object對象的 getNameFunc()函數盟广,此時getNameFunc()函數的函數定義為

    function(){
        return this.name;
    };

同時getNameFunc()函數的調用上下文應當為全局 windows闷串,因此當函數再找不到this.name定義的時候會向上,也就是當前調用上下文也就是windows尋找筋量,于是發(fā)現 name是有定義的烹吵,所以第一個思考題輸出結果為The Windows

  • 5. 阮一峰大佬的思考題 2

題目


image.png

這一道題在函數getNameFunc()內部有一句

    var that = this;

我們都知道this的指向取決于調用上下文 而不是他所在的代碼塊桨武,因此此時的this實際指向的應當是object對象肋拔,所以當函數在尋找that.name定義的時候,會找到他的調用上下文object
因此這道題會輸出 My Object

?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末呀酸,一起剝皮案震驚了整個濱河市凉蜂,隨后出現的幾起案子,更是在濱河造成了極大的恐慌性誉,老刑警劉巖窿吩,帶你破解...
    沈念sama閱讀 212,383評論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現場離奇詭異艾栋,居然都是意外死亡爆存,警方通過查閱死者的電腦和手機,發(fā)現死者居然都...
    沈念sama閱讀 90,522評論 3 385
  • 文/潘曉璐 我一進店門蝗砾,熙熙樓的掌柜王于貴愁眉苦臉地迎上來先较,“玉大人携冤,你說我怎么就攤上這事∠猩祝” “怎么了曾棕?”我有些...
    開封第一講書人閱讀 157,852評論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長菜循。 經常有香客問我翘地,道長,這世上最難降的妖魔是什么癌幕? 我笑而不...
    開封第一講書人閱讀 56,621評論 1 284
  • 正文 為了忘掉前任衙耕,我火速辦了婚禮,結果婚禮上勺远,老公的妹妹穿的比我還像新娘橙喘。我一直安慰自己,他們只是感情好胶逢,可當我...
    茶點故事閱讀 65,741評論 6 386
  • 文/花漫 我一把揭開白布厅瞎。 她就那樣靜靜地躺著,像睡著了一般初坠。 火紅的嫁衣襯著肌膚如雪和簸。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,929評論 1 290
  • 那天碟刺,我揣著相機與錄音锁保,去河邊找鬼。 笑死南誊,一個胖子當著我的面吹牛身诺,可吹牛的內容都是我干的。 我是一名探鬼主播抄囚,決...
    沈念sama閱讀 39,076評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼霉赡,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了幔托?” 一聲冷哼從身側響起穴亏,我...
    開封第一講書人閱讀 37,803評論 0 268
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎重挑,沒想到半個月后嗓化,有當地人在樹林里發(fā)現了一具尸體,經...
    沈念sama閱讀 44,265評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡谬哀,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,582評論 2 327
  • 正文 我和宋清朗相戀三年刺覆,在試婚紗的時候發(fā)現自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片史煎。...
    茶點故事閱讀 38,716評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡谦屑,死狀恐怖驳糯,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情氢橙,我是刑警寧澤酝枢,帶...
    沈念sama閱讀 34,395評論 4 333
  • 正文 年R本政府宣布,位于F島的核電站悍手,受9級特大地震影響帘睦,放射性物質發(fā)生泄漏。R本人自食惡果不足惜坦康,卻給世界環(huán)境...
    茶點故事閱讀 40,039評論 3 316
  • 文/蒙蒙 一竣付、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧滞欠,春花似錦卑笨、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,798評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽妖滔。三九已至隧哮,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間座舍,已是汗流浹背沮翔。 一陣腳步聲響...
    開封第一講書人閱讀 32,027評論 1 266
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留曲秉,地道東北人采蚀。 一個月前我還...
    沈念sama閱讀 46,488評論 2 361
  • 正文 我出身青樓,卻偏偏與公主長得像承二,于是被迫代替她去往敵國和親榆鼠。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,612評論 2 350

推薦閱讀更多精彩內容