组件化和模块化

组件化
为什么要组件化开发
有时候页面代码量太大，逻辑太多或者同一个功能组件在许多页面均有使用，维护起来相当复杂，这个时候，就需要组件化开发来进行功能拆分、组件封装，以达到组件通用性，增强代码可读性，维护成本也能大大降低。
组件化开发的优点
很大程度上降低系统各个功能的耦合性，并且提高了功能内部的聚合性。这对前端工程化及降低代码的维护来说，是有很大的好处的，耦合性的降低，提高了系统的伸展性，降低了开发的复杂度，提升开发效率，降低开发成本。
组件化开发的原则
专一
可配置性
标准性
复用性
可维护性

模块化
为什么要模块化
早期的JavaScript版本没有块级作用域、没有类、没有包、也没有模块，这样会带来一些问题，如复用、依赖、冲突、代码组织混乱等，随着前端的膨胀，模块化显得非常迫切
模块化的好处
避免变量污染，命名冲突
提高代码复用率
提高了可维护性
方便依赖关系管理
模块化的几种方法
函数封装

var myModule = {
	var1:1,
	var2:2,
	fn1:function() {
	},
	fn2:function() {
	}
}

总结：这样避免了变量污染，只要保证模块名唯一即可，同时同一模块内的成员也有了关系
缺陷：外部可以随意修改内部成员，这样就会产生意外的安全问题
立即执行函数表达式（IIFE）

var myModule = (function() {
	var var1=1;
	var var2=2;
	function fn1() {
	}
	function fn2() {
	}
	return {
		fn1:fn1,
		fn2:fn2
	};
})();

总结：这样在模块外部无法修改我们没有暴露出来的变量、函数
缺点：功能相对较弱，封装过程增加了工作量，仍会导致命名空间污染可能、闭包是有成本的。