成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專(zhuān)欄INFORMATION COLUMN

JavaScript專(zhuān)題之惰性函數(shù)

Jackwoo / 3308人閱讀

摘要：專(zhuān)題系列第十五篇，講解惰性函數(shù)需求我們現(xiàn)在需要寫(xiě)一個(gè)函數(shù)，這個(gè)函數(shù)返回首次調(diào)用時(shí)的對(duì)象，注意是首次。解決四惰性函數(shù)不錯(cuò)，惰性函數(shù)就是解決每次都要進(jìn)行判斷的這個(gè)問(wèn)題，解決原理很簡(jiǎn)單，重寫(xiě)函數(shù)。

JavaScript 專(zhuān)題系列第十五篇，講解惰性函數(shù)
需求

我們現(xiàn)在需要寫(xiě)一個(gè) foo 函數(shù)，這個(gè)函數(shù)返回首次調(diào)用時(shí)的 Date 對(duì)象，注意是首次。

解決一：普通方法 
var t;
function foo() {
    if (t) return t;
    t = new Date()
    return t;
}

問(wèn)題有兩個(gè)，一是污染了全局變量，二是每次調(diào)用 foo 的時(shí)候都需要進(jìn)行一次判斷。

解決二：閉包

我們很容易想到用閉包避免污染全局變量。

var foo = (function() {
    var t;
    return function() {
        if (t) return t;
        t = new Date();
        return t;
    }
})();

然而還是沒(méi)有解決調(diào)用時(shí)都必須進(jìn)行一次判斷的問(wèn)題。

解決三：函數(shù)對(duì)象

函數(shù)也是一種對(duì)象，利用這個(gè)特性，我們也可以解決這個(gè)問(wèn)題。

function foo() {
    if (foo.t) return foo.t;
    foo.t = new Date();
    return foo.t;
}

依舊沒(méi)有解決調(diào)用時(shí)都必須進(jìn)行一次判斷的問(wèn)題。

解決四：惰性函數(shù)

不錯(cuò)，惰性函數(shù)就是解決每次都要進(jìn)行判斷的這個(gè)問(wèn)題，解決原理很簡(jiǎn)單，重寫(xiě)函數(shù)。

var foo = function() {
    var t = new Date();
    foo = function() {
        return t;
    };
    return foo();
};
更多應(yīng)用

DOM 事件添加中，為了兼容現(xiàn)代瀏覽器和 IE 瀏覽器，我們需要對(duì)瀏覽器環(huán)境進(jìn)行一次判斷：

// 簡(jiǎn)化寫(xiě)法
function addEvent (type, el, fn) {
    if (window.addEventListener) {
        el.addEventListener(type, fn, false);
    }
    else if(window.attachEvent){
        el.attachEvent("on" + type, fn);
    }
}

問(wèn)題在于我們每當(dāng)使用一次 addEvent 時(shí)都會(huì)進(jìn)行一次判斷。

利用惰性函數(shù)，我們可以這樣做：

function addEvent (type, el, fn) {
    if (window.addEventListener) {
        addEvent = function (type, el, fn) {
            el.addEventListener(type, fn, false);
        }
    }
    else if(window.attachEvent){
        addEvent = function (type, el, fn) {
            el.attachEvent("on" + type, fn);
        }
    }
}

當(dāng)然我們也可以使用閉包的形式：

var addEvent = (function(){
    if (window.addEventListener) {
        return function (type, el, fn) {
            el.addEventListener(type, fn, false);
        }
    }
    else if(window.attachEvent){
        return function (type, el, fn) {
            el.attachEvent("on" + type, fn);
        }
    }
})();

當(dāng)我們每次都需要進(jìn)行條件判斷，其實(shí)只需要判斷一次，接下來(lái)的使用方式都不會(huì)發(fā)生改變的時(shí)候，想想是否可以考慮使用惰性函數(shù)。

重要參考

Lazy Function Definition Pattern

專(zhuān)題系列

JavaScript專(zhuān)題系列目錄地址：https://github.com/mqyqingfeng/Blog。

JavaScript專(zhuān)題系列預(yù)計(jì)寫(xiě)二十篇左右，主要研究日常開(kāi)發(fā)中一些功能點(diǎn)的實(shí)現(xiàn)，比如防抖、節(jié)流、去重、類(lèi)型判斷、拷貝、最值、扁平、柯里、遞歸、亂序、排序等，特點(diǎn)是研(chao)究(xi) underscore 和 jQuery 的實(shí)現(xiàn)方式。

如果有錯(cuò)誤或者不嚴(yán)謹(jǐn)?shù)牡胤?，?qǐng)務(wù)必給予指正，十分感謝。如果喜歡或者有所啟發(fā)，歡迎 star，對(duì)作者也是一種鼓勵(lì)。

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/84794.html

相關(guān)文章

  • JavaScript專(zhuān)題系列文章

    摘要：專(zhuān)題系列共計(jì)篇，主要研究日常開(kāi)發(fā)中一些功能點(diǎn)的實(shí)現(xiàn)，比如防抖節(jié)流去重類(lèi)型判斷拷貝最值扁平柯里遞歸亂序排序等，特點(diǎn)是研究專(zhuān)題之函數(shù)組合專(zhuān)題系列第十六篇，講解函數(shù)組合，并且使用柯里化和函數(shù)組合實(shí)現(xiàn)模式需求我們需要寫(xiě)一個(gè)函數(shù)，輸入，返回。 JavaScript 專(zhuān)題之從零實(shí)現(xiàn) jQuery 的 extend JavaScritp 專(zhuān)題系列第七篇，講解如何從零實(shí)現(xiàn)一個(gè) jQuery 的 ext...

    Maxiye 評(píng)論0 收藏0

  • JavaScript專(zhuān)題系列20篇正式完結(jié)！

    摘要：寫(xiě)在前面專(zhuān)題系列是我寫(xiě)的第二個(gè)系列，第一個(gè)系列是深入系列。專(zhuān)題系列自月日發(fā)布第一篇文章，到月日發(fā)布最后一篇，感謝各位朋友的收藏點(diǎn)贊，鼓勵(lì)指正。 寫(xiě)在前面 JavaScript 專(zhuān)題系列是我寫(xiě)的第二個(gè)系列，第一個(gè)系列是 JavaScript 深入系列。 JavaScript 專(zhuān)題系列共計(jì) 20 篇，主要研究日常開(kāi)發(fā)中一些功能點(diǎn)的實(shí)現(xiàn)，比如防抖、節(jié)流、去重、類(lèi)型判斷、拷貝、最值、扁平、柯里...

    sixleaves 評(píng)論0 收藏0

  • 前端_JavaScript

    摘要：為此決定自研一個(gè)富文本編輯器。例如當(dāng)要轉(zhuǎn)化的對(duì)象有環(huán)存在時(shí)子節(jié)點(diǎn)屬性賦值了父節(jié)點(diǎn)的引用，為了關(guān)于函數(shù)式編程的思考作者李英杰，美團(tuán)金融前端團(tuán)隊(duì)成員。只有正確使用作用域，才能使用優(yōu)秀的設(shè)計(jì)模式，幫助你規(guī)避副作用。 JavaScript 專(zhuān)題之惰性函數(shù) JavaScript 專(zhuān)題系列第十五篇，講解惰性函數(shù) 需求 我們現(xiàn)在需要寫(xiě)一個(gè) foo 函數(shù)，這個(gè)函數(shù)返回首次調(diào)用時(shí)的 Date 對(duì)象，注意...

    Benedict Evans 評(píng)論0 收藏0

  • 【進(jìn)階 6-2 期】深入高階函數(shù)應(yīng)用之柯里化

    摘要：引言上一節(jié)介紹了高階函數(shù)的定義，并結(jié)合實(shí)例說(shuō)明了使用高階函數(shù)和不使用高階函數(shù)的情況。我們期望函數(shù)輸出，但是實(shí)際上調(diào)用柯里化函數(shù)時(shí)，所以調(diào)用時(shí)就已經(jīng)執(zhí)行并輸出了，而不是理想中的返回閉包函數(shù)，所以后續(xù)調(diào)用將會(huì)報(bào)錯(cuò)。引言 上一節(jié)介紹了高階函數(shù)的定義，并結(jié)合實(shí)例說(shuō)明了使用高階函數(shù)和不使用高階函數(shù)的情況。后面幾部分將結(jié)合實(shí)際應(yīng)用場(chǎng)景介紹高階函數(shù)的應(yīng)用，本節(jié)先來(lái)聊聊函數(shù)柯里化，通過(guò)介紹其定義、比較常見(jiàn)的...

    stackvoid 評(píng)論0 收藏0

  • 2017-08-22 前端日?qǐng)?bào)

    摘要：前端日?qǐng)?bào)精選專(zhuān)題之惰性函數(shù)中的執(zhí)行上下文和調(diào)用棧是什么個(gè)人總結(jié)新特性緩存機(jī)制詳解技術(shù)內(nèi)幕的秘密中文第期給前端工程師講設(shè)計(jì)終篇行代碼搭建神經(jīng)網(wǎng)絡(luò)知乎專(zhuān)欄版模塊，桌面支付請(qǐng)求，，以及眾成翻譯你應(yīng)該知道的知乎專(zhuān)欄技術(shù)周刊同步代碼書(shū)寫(xiě)異 2017-08-22 前端日?qǐng)?bào) 精選 JavaScript專(zhuān)題之惰性函數(shù)JavaScript 中的執(zhí)行上下文和調(diào)用棧是什么？個(gè)人總結(jié)（css3新特性） HTT...

    Fundebug 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<