JS高阶--惰性函数

JS惰性函数，是针对优化频繁使用的函数。常用于函数库的编写、单例模式之中。

首先，写一个test函数，返回首次调用该函数的时间（使用new Date().getTime()）,注意，返回 首次调用时间。

不好的写法：

var t = null;
function test () {   
    if(t){        //缺点：每次调用函数就需要进行一次if判断。并且t会污染全局变量。【惰性函数就是将这里的数据进行保存。下次不需要再进行判断】
        return t; 
    }
    t = new Date().getTime();
    return t;
}

test();   //其实在第一次调用之后，t的值已经固定了。
test();    //但是在接下来的三次调用test的时候，仍然要进行if-else的判断。
test();
test();
//结果：四次都返回的同一个值

优化：  使得t不会污染全局变量。

var test = (function(){
    var t = null;
    return function () {       
         if(t){        //【只要第一次调用之后，test的t的值就已经知道了】该方法缺点：每一次调用test时仍然要判断。
            return t; 
        }
        t = new Date().getTime();
     }
    return t;
})();

完美版：使得第一次调用test函数之后，不会再进行if-else的判断，而是在第2、3、......、n次调用test时直接获取到t的值。

var test = function(){
    var t = new Date().getTime();
    test = function () {    //第一次调用之后，改变test函数，使得可以直接返回t
        return t;
    }
    return test();
}

应用：

添加绑定事件（原版）

function addEvent(dom, type, handle){
    if(dom.addEventListener){
        dom.addEventListener(type, handler, false);
    }else{
        dom.attachEvent('on' + type, handler);
    }
}

但是每一次都要对浏览器的判断，可以在第一次判断后，就保留判断，下一次就不需要判断了，使得性能优化非常多。

使用惰性函数优化（改进版）：

function addEvent(dom, type, handle){
    if(dom.addEventListener){
        dom.addEventListener(type, handler, false);
        addEvent = function (dom, type, handler){   //第一次判断后，之后就不需要再判断了。
            dom.addEventListener(type, handler, false);
        }
    }else{
        dom.attachEvent('on' + type, handler);
        addEvent = function (dom, type, handler){
            dom.attachEvent('on' + type,  handler);
        }
    }
    return addEvent;
}