JS高阶编程之惰性函数和单例设计模式

开发过程中，多人开发，写不同模块，如果有一下需求：
天气信息管理（查询，设置地区…）A人员开发
新闻信息管理（查询，设置地区，修改…）B人员开发

若开发时都使用let，难保开发人员命名一致:

//天气模块---A开发
let queryWeather = function (){
	//...
}
let setCity = function (){
//...
}
//新闻模块 ----B开发
let queryNews = function() {
//...
}
let setCity = function (){
//...
}

多个人代码合并时，可能编译阶段都编译不过去，会报错，所以可以使用闭包方式，将自己写的函数单独放进去：保护两个模块中的内容不冲突

//天气模块 ---A开发
(function(){
	let _default = 'beijing'; //默认的地点
	let queryWeather = function (){
			//...
		}
		let setCity = function (){
		//...
		}
})();
//新闻模块  ----B开发
(function(){
	let _default = 'beijing'; //默认的地点，不会冲突
	let queryNews = function(){
		//...
	}
})()

如果想在一个模块中使用另一个模块中的方法，可以怎么做？
在新闻模块中如果想使用天气模块中的设置地区，可以return一个对象，将被使用的方法暴露出去，在新闻模块中去调用天气模块的方法。
详细写法如下：

//天气模块这么写
let weatherModule = (function(){ //赋值的时候已经执行自执行函数
	let _default = 'beijing'; //默认的地点
	let queryWeather = function (){
			//...
		}
		let setCity = function (){
		//...
		}
		retuen {
		//ES6语法  setCity:setCity
			setCity
		}
})();
//新闻模块中：
let newsModule = (function(){
	let _default = 'beijing'; //默认的地点，不会冲突
	let queryNews = function(){
		//在此调用天气模块的setCity方法
		weatherModule.setCity();
	}
	//若没有想暴露的方法，直接return{}
	return {};
})()

只要想供外边使用的方法，都使用return返回出去。
以上的代码示例，这种方式称为单例设计模式（最原始的模块化思想），就是利用闭包机制，把写的方法包起来，保证自己的方法变量都是私有的，与别人写的不冲突；若想给别人用，就暴露出去。

在不使用react，Vue之前，都是使用这种模式，利用闭包的保护保存机制，防止冲突，想模块中方法互相调用，就使用这种单例模块化思想。

DOM2事件绑定：
标准的事件绑定：元素.addEventListner()
IE678事件绑定：元素.attachEvent()

写一个注册事件：

function emit(element, type, func){
		element.addEventListener(type,func,false);
	}

处理兼容：

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

执行emit()一次，就要走一遍以上的判断。

如果使用闭包，利用函数重写，写法如下，只判断一遍，下次调用时不会再进行判断，直接调用重写后的方法。

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

以上就是js的惰性思想，惰性函数。