js中的閉包學(xué)習(xí)心得
閉包
按中文的意思就是關(guān)上一個(gè)包的意思。如果我們把函數(shù)的作用域當(dāng)做是一個(gè)包的話(huà),那這個(gè)詞很形象體現(xiàn)了它的作用 。函數(shù)的正常的執(zhí)行流程是當(dāng)函數(shù)中的語(yǔ)句執(zhí)行完后,程序會(huì)自動(dòng)銷(xiāo)毀這個(gè)函數(shù)的作用域,但是當(dāng)一個(gè)函數(shù)中聲明了另一個(gè)函數(shù),并且這個(gè)子函數(shù)執(zhí)行時(shí)存在引用父函數(shù)的變量,就會(huì)形成閉包,形象點(diǎn)說(shuō)就相當(dāng)于把父函數(shù)的作用域給關(guān)閉了起來(lái),不讓程序去銷(xiāo)毀它。
例如:
function a() { var name = "xuxu"; function b() { console.log(name); } // 此處產(chǎn)生閉包 b(); } a();
當(dāng)函數(shù)可以記住并訪(fǎng)問(wèn)它所在的作用域鏈時(shí),就產(chǎn)生了閉包 當(dāng)然,大部分的閉包都不是這么直觀(guān)的,因?yàn)樽雍瘮?shù)的調(diào)用是可以在父函數(shù)之外的,例如:
function a() { var name = "xuxu"; function b() { console.log(name); } return b; } var c=a(); // 此處產(chǎn)生閉包 此處的c函數(shù)其實(shí)就是a函數(shù) c();
通過(guò)以上代碼,我們也可以看出一個(gè)閉包的好處,就是我們?cè)偃肿饔糜颍ù颂幨莣idow)下訪(fǎng)問(wèn)到了局部作用域(a函數(shù))的作用域的值,按正常的詞法作用域是無(wú)法這么做的,但是當(dāng)我們使用閉包是就可以了。然后我們?cè)倏匆稽c(diǎn)我們平時(shí)寫(xiě)的比較多的:
function foo() { var a = 2; function baz() { // 2 console.log( a ); } bar( baz ); } function bar(fn) { // 大家快看呀,這就是閉包! fn(); }
又或者
var fn; function foo() { var a = 2; function baz() { console.log( a ); } // 將baz分配給全局變量 fn = baz; } function bar() { // 大家快看呀,這就是閉包! fn(); } foo(); // 2 bar();
以上也是閉包,因此在函數(shù)內(nèi)部調(diào)用子函數(shù),或者通過(guò)何種手段將內(nèi)部函數(shù)傳遞到所在的詞法作用域以外,它都會(huì)持有對(duì)原始定義作用域的引用,無(wú)論在何處執(zhí)行這個(gè)函數(shù)都會(huì)使用閉包。
- 通俗易懂地解釋JS中的閉包
- JS繼承與閉包及JS實(shí)現(xiàn)繼承的三種方式
- 淺談JavaScript作用域和閉包
- JS閉包的幾種常見(jiàn)形式實(shí)例詳解
- JS實(shí)現(xiàn)閉包中的沙箱模式示例
- JavaScript閉包的簡(jiǎn)單應(yīng)用
- 通過(guò)示例徹底搞懂js閉包
- JavaScript閉包和回調(diào)詳解
- 淺談JS封閉函數(shù)、閉包、內(nèi)置對(duì)象
- JavaScript閉包_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
- 深入理解Javascript中的作用域鏈和閉包
- JS閉包可被利用的常見(jiàn)場(chǎng)景小結(jié)
- 利用js的閉包原理做對(duì)象封裝及調(diào)用方法
- javascript閉包功能與用法實(shí)例分析
- JavaScript中閉包的詳解
- JS閉包用法實(shí)例分析
- 圖解Javascript——作用域、作用域鏈、閉包
- 輕松理解JavaScript閉包
相關(guān)文章
JS面向?qū)ο缶幊虒?shí)現(xiàn)的Tab選項(xiàng)卡案例詳解
這篇文章主要介紹了JS面向?qū)ο缶幊虒?shí)現(xiàn)的Tab選項(xiàng)卡,結(jié)合具體案例形式詳細(xì)分析了JS基于面向?qū)ο蟪绦蛟O(shè)計(jì)實(shí)現(xiàn)Tab選項(xiàng)卡的相關(guān)操作技巧,需要的朋友可以參考下2020-03-03云開(kāi)發(fā)進(jìn)階uniCloud-db組件與JQL語(yǔ)法的轉(zhuǎn)換詳解
這篇文章主要為大家介紹了云開(kāi)發(fā)進(jìn)階uniCloud-db組件與JQL語(yǔ)法的轉(zhuǎn)換詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03Bootstrap模態(tài)對(duì)話(huà)框的簡(jiǎn)單使用
這篇文章主要為大家詳細(xì)介紹了Bootstrap模態(tài)對(duì)話(huà)框的簡(jiǎn)單使用,感興趣的小伙伴們可以參考一下2016-04-04微信小程序?qū)崿F(xiàn)表格前后臺(tái)分頁(yè)
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)表格前后臺(tái)分頁(yè),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-08-08HTML元素拖拽功能實(shí)現(xiàn)的完整實(shí)例
這篇文章主要給大家介紹了關(guān)于HTML元素拖拽功能實(shí)現(xiàn)的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12微信小程序?qū)崿F(xiàn)答題倒計(jì)時(shí)
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)答題倒計(jì)時(shí),自定義計(jì)時(shí)器功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-09-09artdialog的圖片/標(biāo)題以及關(guān)閉按鈕不顯示的解決方法
正如標(biāo)題所言不顯示的原因是因其它c(diǎn)ss樣式文件中包含div{ overflow:hidden; }引起的artdialog的圖片以及關(guān)閉按鈕不顯示,具體的解決方法如下,感興趣的朋友可以參考下哈2013-06-06