JavaScript中如何應(yīng)用閉包

今天小編給大家分享一下JavaScript中如何應(yīng)用閉包的相關(guān)知識(shí)點(diǎn)，內(nèi)容詳細(xì)，邏輯清晰，相信大部分人都還太了解這方面的知識(shí)，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來(lái)了解一下吧。

創(chuàng)新互聯(lián)專業(yè)為企業(yè)提供澧縣網(wǎng)站建設(shè)、澧縣做網(wǎng)站、澧縣網(wǎng)站設(shè)計(jì)、澧縣網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)與制作、澧縣企業(yè)網(wǎng)站模板建站服務(wù)，十年澧縣做網(wǎng)站經(jīng)驗(yàn)，不只是建網(wǎng)站，更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。

什么是閉包(Closure)

簡(jiǎn)單講，閉包就是指有權(quán)訪問(wèn)另一個(gè)函數(shù)作用域中的變量的函數(shù)。

MDN 上面這么說(shuō)：閉包是一種特殊的對(duì)象。它由兩部分構(gòu)成：函數(shù)，以及創(chuàng)建該函數(shù)的環(huán)境。環(huán)境由閉包創(chuàng)建時(shí)在作用域中的任何局部變量組成。

但是，網(wǎng)上找了好多資料，它們對(duì)閉包的定義也各有各樣，搞得我也不知道怎么去定義閉包了，所以干脆不去定義了，意會(huì)吧。

道可道，非常道;名可名，非常名。

產(chǎn)生一個(gè)閉包

創(chuàng)建閉包最常見(jiàn)方式，就是在一個(gè)函數(shù)內(nèi)部創(chuàng)建另一個(gè)函數(shù)。下面例子中的 closure 就是一個(gè)閉包：

function func(){   var a = 1,b = 2;      function closure(){     return a+b;   }   return closure; }

閉包的作用域鏈包含著它自己的作用域，以及包含它的函數(shù)的作用域和全局作用域。

閉包的注意事項(xiàng)

通常，函數(shù)的作用域及其所有變量都會(huì)在函數(shù)執(zhí)行結(jié)束后被銷毀。但是，在創(chuàng)建了一個(gè)閉包以后，這個(gè)函數(shù)的作用域就會(huì)一直保存到閉包不存在為止。

function makeAdder(x) {   return function(y) {     return x + y;   }; }  var add5 = makeAdder(5); var add10 = makeAdder(10);  console.log(add5(2));  // 7 console.log(add10(2)); // 12  // 釋放對(duì)閉包的引用 add5 = null; add10 = null;

add5 和 add10 都是閉包。它們共享相同的函數(shù)定義，但是保存了不同的環(huán)境。在 add5 的環(huán)境中，x 為 5。而在 add10 中，x 則為  10。***通過(guò) null 釋放了 add5 和 add10 對(duì)閉包的引用。

在javascript中，如果一個(gè)對(duì)象不再被引用，那么這個(gè)對(duì)象就會(huì)被垃圾回收機(jī)制回收;

如果兩個(gè)對(duì)象互相引用，而不再被第3者所引用，那么這兩個(gè)互相引用的對(duì)象也會(huì)被回收。

閉包只能取得包含函數(shù)中任何變量的***一個(gè)值，這是因?yàn)殚]包所保存的是整個(gè)變量對(duì)象，而不是某個(gè)特殊的變量。

function test(){   var arr = [];   for(var i = 0;i < 10;i++){     arr[i] = function(){       return i;     };   }   for(var a = 0;a < 10;a++){     console.log(arr[a]());   } } test(); // 連續(xù)打印 10 個(gè) 10

對(duì)于上面的情況，如果我們改變代碼如下：

function test(){   var arr = [];   for(let i = 0;i < 10;i++){  // 僅在這里作出了改動(dòng)     arr[i] = function(){       return i;     };   }   for(var a = 0;a < 10;a++){     console.log(arr[a]());   } } test(); // 打印 0 到 9

對(duì)于上面兩種代碼的解釋，請(qǐng)看我在 segmentfault 上面的提問(wèn)：鏈接

閉包中的 this 對(duì)象

var name = "The Window";  var obj = {   name: "My Object",      getName: function(){     return function(){       return this.name;     };   } };  console.log(obj.getName()());  // The Window

obj.getName()()實(shí)際上是在全局作用域中調(diào)用了匿名函數(shù)，this指向了window。這里要理解函數(shù)名與函數(shù)功能(或者稱函數(shù)值)是分割開(kāi)的，不要認(rèn)為函數(shù)在哪里，其內(nèi)部的this就指向哪里。匿名函數(shù)的執(zhí)行環(huán)境具有全局性，因此其  this 對(duì)象通常指向 window。

var name = "The Window";  var obj = {   name: "My Object",      getName: function(){     var that = this;     return function(){       return that.name;     };   } };  console.log(obj.getName()());  // My Object

閉包的應(yīng)用

應(yīng)用閉包的主要場(chǎng)合是：設(shè)計(jì)私有的方法和變量。

任何在函數(shù)中定義的變量，都可以認(rèn)為是私有變量，因?yàn)椴荒茉诤瘮?shù)外部訪問(wèn)這些變量。私有變量包括函數(shù)的參數(shù)、局部變量和函數(shù)內(nèi)定義的其他函數(shù)。

把有權(quán)訪問(wèn)私有變量的公有方法稱為特權(quán)方法(privileged method)。

function Animal(){      // 私有變量   var series = "哺乳動(dòng)物";   function run(){     console.log("Run!!!");   }      // 特權(quán)方法   this.getSeries = function(){     return series;   }; }

模塊模式(The Module Pattern)：為單例創(chuàng)建私有變量和方法。

單例(singleton)：指的是只有一個(gè)實(shí)例的對(duì)象。JavaScript 一般以對(duì)象字面量的方式來(lái)創(chuàng)建一個(gè)單例對(duì)象。

var singleton = {   name: "percy",   speak:function(){     console.log("speaking!!!");   },   getName: function(){     return this.name;   } };

上面是普通模式創(chuàng)建的單例，下面使用模塊模式創(chuàng)建單例：

var singleton = (function(){      // 私有變量   var age = 22;   var speak = function(){     console.log("speaking!!!");   };      // 特權(quán)（或公有）屬性和方法   return {     name: "percy",     getAge: function(){       return age;     }   }; })();

匿名函數(shù)***的用途是創(chuàng)建閉包，并且還可以構(gòu)建命名空間，以減少全局變量的使用。從而使用閉包模塊化代碼，減少全局變量的污染。

var objEvent = objEvent || {}; (function(){      var addEvent = function(){        // some code     };     function removeEvent(){       // some code     }      objEvent.addEvent = addEvent;     objEvent.removeEvent = removeEvent; })();

在這段代碼中函數(shù) addEvent 和 removeEvent 都是局部變量，但我們可以通過(guò)全局變量 objEvent  使用它，這就大大減少了全局變量的使用，增強(qiáng)了網(wǎng)頁(yè)的安全性。

一個(gè)閉包計(jì)數(shù)器

var countNumber = (function(){   var num = 0;   return function(){     return ++num;   }; })();

閉包的缺陷

• 閉包的缺點(diǎn)就是常駐內(nèi)存會(huì)增大內(nèi)存使用量，并且使用不當(dāng)很容易造成內(nèi)存泄露。

• 如果不是因?yàn)槟承┨厥馊蝿?wù)而需要閉包，在沒(méi)有必要的情況下，在其它函數(shù)中創(chuàng)建函數(shù)是不明智的，因?yàn)殚]包對(duì)腳本性能具有負(fù)面影響，包括處理速度和內(nèi)存消耗。

***再來(lái)一些有關(guān)閉包的面試題

下面代碼中，標(biāo)記 ? 的地方輸出分別是什么?

function fun(n,o){   console.log(o);   return {     fun: function(m){       return fun(m,n);     }   }; }  var a = fun(0);  // ? a.fun(1);        // ?         a.fun(2);        // ? a.fun(3);        // ?  var b = fun(0).fun(1).fun(2).fun(3);  // ?  var c = fun(0).fun(1);  // ? c.fun(2);        // ? c.fun(3);        // ?

undefined 0 0 0 undefined, 0, 1, 2 undefined, 0 1 1

以上就是“JavaScript中如何應(yīng)用閉包”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會(huì)為大家更新不同的知識(shí)，如果還想學(xué)習(xí)更多的知識(shí)，請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

分享標(biāo)題：JavaScript中如何應(yīng)用閉包
鏈接地址：http://bm7419.com/article8/iihiop.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供電子商務(wù)、網(wǎng)站維護(hù)、手機(jī)網(wǎng)站建設(shè)、微信小程序、全網(wǎng)營(yíng)銷推廣、網(wǎng)站收錄

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)