惰性载入

惰性载入适应场景：

 

     兼容浏览器差异     

     改进重复判断后重复执行相同的的操作的问题

 

惰性载入

 

特点： 只判断一次，通过第一次的计算结果 修改函数自身

 

 

重复判断——》（改进）匿名函数自执行——》（改进）惰性载入

 

*************************************************************

//1.
//函数内部每次都根据判断返回值,每次都要判断
var addEvent1 = function (elem, type, handler) {
    if (window.addEventListener) {
        return elem.addEventListener(type, handler, false)
    }
    if (window.attachEvent) {
        return elem.attachEvent("on" + type, handler)
    }
}

*********************************************************

//2.
//代码加载时，匿名函数自执行，判断只执行一次，但可能用不到，浪费性能
var addEvent2 = (function(){
    if (window.addEventListener) {
        return function (elem, type, handler) {
            elem.addEventListener(type, handler, false)
        }
    }
    if (window.attachEvent) {
        return function(elem, type, handler) {
            elem.attachEvent("on" + type, handler)
        }
    }
})()

*******************************************************

//3.
//惰性载入
//判断执行一次，不会浪费性能
//第一次进入条件分支之后， 在函数内部会重写这个函数，
//重写之后的函数就是我们期望的addEvent函数，在下一次进入addEvent函数的时候，addEvent函数里不存在条件分支语句
var addEvent3 = function(elem, type, handler) {
    if (window.addEventListener) {
        addEvent = function (elem, type, handler) {
            elem.addEventListener(type, handler, false)
        }
    } else if (window.attachEvent) {
        addEvent = function(elem, type, handler) {
            elem.attachEvent("on" + type, handler)
        }
    }

    addEvent(elem, type, handler)
}

*********************************************************