JS中的惰性加载函数

由于浏览器兼容性不同，所以当我们编写通用代码的时候，就要根据浏览器做出一些判断，比如事件绑定方法：

let addEvent =  function (elem, type, handler) {
	if (window.addEventListener) {
		return elem.addEventListener(type, handler, false);
	}
	if (window.attachEvent) {
		return elem.attachEvent('on' + type, handler);
	}
};

这样写虽然可以满足需求，但是每次执行，都会调用if条件的判断，我们能不能在使用的时候只需要判断一次呢？

let addEvent =  (function () {
	if (window.addEventListener) {
		return function(elem, type, handler) {
			return elem.addEventListener(type, handler, false);
		}
	}
	if (window.attachEvent) {
		return function(elem, type, handler) {
			return elem.attachEvent('on' + type, handler);
		}
	}
})();

这样代码加载完后，就立刻进行了一次判断，而且返回了正确的逻辑函数，每次调用就会直接调用正确的函数了。

但是还没完，如果我们在编程过程中，并没有用到这个函数，初始化加载就没有必要了。那如何只在使用的时候加载呢？

let addEvent =  function (elem, type, handler) {
	if (window.addEventListener) {
		addEvent = function(elem, type, handler) {
			elem.addEventListener(type, handler, false);
		}
	}
	if (window.attachEvent) {
		addEvent = function(elem, type, handler) {
			elem.attachEvent('on' + type, handler);
		}
	}
	addEvent(elem, type, handler); // 第一次调用
};

这样第一次调用后，addEvent被重新赋值为正确的函数，以后再调用就直接使用正确的函数来调用了。
这就是所谓的惰性加载函数。