深入淺出Javascript：面向?qū)ο笾]包

instein 發(fā)布于2019-08-19 18:12 / 2214人閱讀

摘要：理解閉包概念閉包是指有權(quán)訪問另一個函數(shù)作用域中的變量的函數(shù)。閉包在執(zhí)行后，仍然可以訪問內(nèi)部的，因?yàn)閷⒌膬?nèi)的活動對象添加到了的作用域鏈。閉包的應(yīng)用監(jiān)聽事件事件錯誤的使用循環(huán)使用閉包封裝函數(shù)，便于使用私有變量。

理解閉包 概念

閉包是指有權(quán)訪問另一個函數(shù)作用域中的變量的函數(shù)。

函數(shù)式閉包（在內(nèi)部保存數(shù)據(jù)和對外部無副作用）

創(chuàng)建方法

在一個函數(shù)內(nèi)部創(chuàng)建另一個函數(shù)（閉包）

原理

普通函數(shù)：在outer()執(zhí)行完，局部變量local被銷毀，內(nèi)存僅僅保存全局作用域。

function outer() {
    var localVal = 30;
    return localVal;
}
outer(); // 30

閉包：在outer()執(zhí)行后，func()仍然可以訪問outer()內(nèi)部的localVal，因?yàn)閒unc()將outer()的內(nèi)的活動對象（localVal）添加到了func()的作用域鏈。在outer()執(zhí)行后，由于localVal被func()的作用域鏈所引用，所以localVal不會被銷毀，而是存在內(nèi)存中，直到func()被銷毀，才會隨之銷毀。

function outer() {
    var localVal = 30;
    return function() {
        return localVal;
    }
}
var func = outer();
func(); // 30

閉包的應(yīng)用

監(jiān)聽事件

!function() {
    var localData = "localData here";
    document.addEventListener("click",
        function() {
            console.log(localData);
        }
    );
}();

ajax事件

!function() {
    var localData = "localData here";
    var url = "http://www.baidu.com/";
    $.ajax({
        url: url;
        success: function() {
            console.log(localData);
        }
    });
}();

錯誤的使用

循環(huán)

使用閉包封裝函數(shù)，便于使用私有變量。 閉包的好壞

好處：靈活方便，封裝

壞處：空間浪費(fèi)，內(nèi)存泄漏（循環(huán)引用），性能消耗

云服務(wù)器 GPU云服務(wù)器深入java面向?qū)ο?/a> javascript 面向?qū)ο?/a> javascript面向?qū)ο?/a> javascript面向?qū)ο缶幊?/a>

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/79313.html

相關(guān)文章

JavaScript深入淺出

摘要：理解的函數(shù)基礎(chǔ)要搞好深入淺出原型使用原型模型，雖然這經(jīng)常被當(dāng)作缺點(diǎn)提及，但是只要善于運(yùn)用，其實(shí)基于原型的繼承模型比傳統(tǒng)的類繼承還要強(qiáng)大。中文指南基本操作指南二繼續(xù)熟悉的幾對方法，包括，，。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。怎樣使用 this 因?yàn)楸救藢儆趥吻岸耍虼宋闹兄豢炊?8 成左右，希望能夠給大家?guī)韼椭?...（據(jù)說是阿里的前端妹子寫的） this 的值到底...

blair 2019-08-21 18:26 評論0 收藏0
面向對象的 JavaScript

摘要：是完全的面向?qū)ο笳Z言，它們通過類的形式組織函數(shù)和變量，使之不能脫離對象存在。而在基于原型的面向?qū)ο蠓绞街校瑢ο髣t是依靠構(gòu)造器利用原型構(gòu)造出來的。 JavaScript 函數(shù)式腳本語言特性以及其看似隨意的編寫風(fēng)格，導(dǎo)致長期以來人們對這一門語言的誤解，即認(rèn)為 JavaScript 不是一門面向?qū)ο蟮恼Z言，或者只是部分具備一些面向?qū)ο蟮奶卣鳌１疚膶⒒貧w面向?qū)ο蟊疽猓瑥膶φZ言感悟的角度闡述為什...

novo 2019-08-21 10:49 評論0 收藏0
JS程序

摘要：設(shè)計(jì)模式是以面向?qū)ο缶幊虨榛A(chǔ)的，的面向?qū)ο缶幊毯蛡鹘y(tǒng)的的面向?qū)ο缶幊逃行┎顒e，這讓我一開始接觸的時(shí)候感到十分痛苦，但是這只能靠自己慢慢積累慢慢思考。想繼續(xù)了解設(shè)計(jì)模式必須要先搞懂面向?qū)ο缶幊蹋駝t只會讓你自己更痛苦。 JavaScript 中的構(gòu)造函數(shù) 學(xué)習(xí)總結(jié)。知識只有分享才有存在的意義。是時(shí)候替換你的 for 循環(huán)大法了~ 《小分享》JavaScript中數(shù)組的那些迭代方法~ ...

melody_lql 2019-08-22 11:22 評論0 收藏0
JavaScript系列（四） - 收藏集 - 掘金

摘要：函數(shù)式編程前端掘金引言面向?qū)ο缶幊桃恢币詠矶际侵械闹鲗?dǎo)范式。函數(shù)式編程是一種強(qiáng)調(diào)減少對程序外部狀態(tài)產(chǎn)生改變的方式。 JavaScript 函數(shù)式編程 - 前端 - 掘金引言面向?qū)ο缶幊桃恢币詠矶际荍avaScript中的主導(dǎo)范式。JavaScript作為一門多范式編程語言，然而，近幾年，函數(shù)式編程越來越多得受到開發(fā)者的青睞。函數(shù)式編程是一種強(qiáng)調(diào)減少對程序外部狀態(tài)產(chǎn)生改變的方式。因此，...

cfanr 2019-08-20 16:33 評論0 收藏0
javasscript - 收藏集 - 掘金

摘要：跨域請求詳解從繁至簡前端掘金什么是為什么要用是的一種使用模式，可用于解決主流瀏覽器的跨域數(shù)據(jù)訪問的問題。異步編程入門道典型的面試題前端掘金在界中，開發(fā)人員的需求量一直居高不下。 jsonp 跨域請求詳解——從繁至簡 - 前端 - 掘金什么是jsonp？為什么要用jsonp?JSONP(JSON with Padding)是JSON的一種使用模式，可用于解決主流瀏覽器的跨域數(shù)據(jù)訪問的問題...

Rango 2019-08-20 17:15 評論0 收藏0