最近看了编程精解里面的模块化一章，很受启发。
/****************/
在开发的实际过程中，根据页面或者逻辑布局，js代码可以按照功能划分为若干个区块：数据交互、表单验证、页面布局等等模块
为了提高开发效率和后期代码维护，很自然的应该将几十个js函数划分为模块，利于调试和后续修改。但写出几十个函数的时候，命名自然就出现问题了，想不出别的函数名或者干脆两个函数重名了，这种因为重复声明而导致的bug称为命名污染，这在大型项目中很常见。
提到模块开发，最容易想到的是通过js文件来分模块存储和调用代码。而文件存储的弊病是：比如首页加载了3，4个js文件（应该不算多），不同文件里面的全局变量，包括函数和变量，怎么保证不存在命名冲突，当然，通过给变量名和函数名前加前缀是一个很笨但是很奏效的办法，有没有什么办法能够从最基础上避免这种命名污染、同时能够实现代码模块化呢？
1.通过模块对象来实现。
举一个书中的例子，要做一个月份翻译器，把1翻译为一月。对于新手来讲很可能是这样的：
var names = [‘一‘,‘二‘,‘三‘,‘四‘,‘五‘,‘六‘,‘七‘,‘八‘,‘九‘,‘十‘,‘十一‘,‘十二‘];
function getMonthName(num){
return names[num-1]+‘月‘;
};
function getMonthNum(str){
for(var i in names){
if( str == (names[i]+‘月‘)){
return i+1;
}
}
};
这里面的names和getMonthName,getMonthNum的生存域都是顶级的，所以如果其他文件或者js代码中声明了名字为names的变量，就会导致程序异常（getMonthName,getMonthNum这么长的名字一般很少重复）。
在一个后台管理网站里面，需要写的函数可能有：表单验证、图片轮播组件、dom加载、从某input里面读数据再拼成json、hover效果、弹出层....如果这些功能或者插件都是直接声明全局函数或全局变量，想命名就会想哭的。
所以这时候，应该想到利用函数闭包来避免产生作用域命名污染，上面代码的最简修改就是
//匿名函数声明并直接调用
//names作为局部变量出现 不会污染顶级作用域，外部无法访问
//通过为顶级作用域的window对象绑定函数的方式，对外暴露接口
(function(){
var names = [‘一‘,‘二‘,‘三‘,‘四‘,‘五‘,‘六‘,‘七‘,‘八‘,‘九‘,‘十‘,‘十一‘,‘十二‘];
window.getMonthName = function getMonthName(num){
return names[num-1]+‘月‘;
};
window.getMonthNum = function getMonthNum(str){
for(var i in names){
if( str == (names[i]+‘月‘)){
return i+1;
}
}
};
})();
这种方法也有不好的地方，我们总不能把所有的函数接口都绑定到window对象的属性当中，那和直接在代码里声明函数没区别。
所以，再一步优化就是做模块对象，很简单的优化，把函数绑定到模块对象上，通过访问模块对象的属性来调用功能：
var monthTranslator = (function(){
var names = [‘一‘,‘二‘,‘三‘,‘四‘,‘五‘,‘六‘,‘七‘,‘八‘,‘九‘,‘十‘,‘十一‘,‘十二‘];
return {
getMonthName:function(num){
return names[num-1]+‘月‘;
},
getMonthNum:function(str){
for(var i in names){
if( str == (names[i]+‘月‘)){
return i+1;
}
}
}
};
})();
上面的函数调用时，直接使用 monthTranslator.getMonthName(1); 就可以了。当然也可以把names作为模块对象的属性出现，这就看功能设计了。
/*************/
上面说的这些就是js代码的模块化，这个见仁见智，有的人可能觉得你这种写法有什么用处呢，“我自己想个命名前缀不就得了，有必要写这么麻烦的函数么”
但是我觉得，良好的代码风格是一个程序员的优良品德。对人对己，都是极好的。
最近喜欢用brackets...小轻快，不错不错