js惰性函數思想介紹

惰性函數是js函數式程式設計的另一個應用，惰性函數表示函數執行的分支只會在函數第一次呼叫的時候執行，本文就來為大家介紹一下js惰性函數思想，希望對大家有一定的幫助。

在vue、react等框架大量應用之前，我們需要使用jQuery或原生js來操作dom寫程式碼，在用原生js進行事件綁定時，我們可以應用DOM2級綁定事件的方法，即：元素.addEventListener()，因為相容性，還有：

元素.attachEvent()。所以我們需要封裝成一個方法：

function emit(element, type, func) {
    if (element.addEventListener) {
        element.addEventListener(type, func, false);
    } else if (element.attachEvent) {
        element.attachEvent('on' + type, func);
    } else { //如果不支持DOM2级事件
        element['on' + type] = func;
    }
}

這個時候，如果一個元素需要透過一個行為添加多個點擊事件，如：

emit(div, 'click', fn1);
emit(div, 'click', fn2);

在第一次給div進行fn1事件綁定時，已經知道瀏覽器可以執行哪種綁定方式，執行綁定fn2時，就沒有必要再次進行判斷，那麼程式碼可以進行修改：

function emit(element, type, func) {
    if (element.addEventListener) {
        emit = function (element, type, func) {
            element.addEventListener(type, func, false);
        };
    } else if (element.attachEvent) {
        emit = function (element, type, func) {
            element.attachEvent('on' + type, func);
        };
    } else {
        emit = function (element, type, func) {
            element['on' + type] = func;
        };
    }
    emit(element, type, func);
}

也就是說，我們在進行第一次判斷後，對函數進行重新定義，這樣在之後再進行綁定時不需要再進行判斷，從性能角度講，雖然創建了閉包，但優於後續進行多次同一個的判斷。

這就是函數的惰性想法，對於同一個判斷，我們只需要進行一次就好。

本文來自 js教學 欄目，歡迎學習！

以上是js惰性函數思想介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！