js中的模块化编写思惟

做为一个新手程序员，在编程时必定要刻意锻炼本身的模块化编写思路，可是究竟什么才是模块化编写对于新人来讲仍是不太可以直观的理解，下面就举个简单的例子来讲明一下

概念：最先接触模块化的说法是从java上，所谓模块化就是将须要用到的方法封装成为一个模块，哪里须要直接调用便可，好比你须要计算1+1和2+2，那么你只须要调用a+b的方法便可，无需反复重写，可是因为js并不支持类的继承，所以如何封装和调用方法就成为js模块化的重要思路。

最简单的方式：

function sum(a,b){
        alert(a+b);
    }
function sub(a,b){
        alert(a-b);
    }
    sum(1,1);
    sum(2,2);
    sub(11,1);

 上面的sum（），sub（）分别均可以算做是一个模块，须要用的时候直接调用便可，可是这种作法的缺点很明显："污染"了全局变量，没法保证不与其余模块发生变量名冲突，并且模块成员之间看不出直接关系。好比a，b是全局变量同时方法中须要改变a，b值的时候。

所以大多时候咱们都会将其采用对象的写法：

var Sum=new Object({
        a:1,
        b:2,
        sum:function(){
            alert(this.a-this.b);
        }
    });
    Sum.sum();

 上面的函数sum()，封装在Sum对象里。使用的时候，就是调用这个对象的属性。

Sum.sum();

可是，这样的写法会暴露全部模块成员，内部状态能够被外部改写,好比：

sum.a=2;

所以，在这个的基础上，咱们能够采用当即执行函数写法：

 var Sum=(function(){
        var a=1;
        var b=2;
        var sum=function(){
            alert(a+b);
        };
        var sub=function(){
            alert(a-b);
        };
        return {
            sum:sum,
            sub:sub
        }
    })();
    alert(Sum.a);
    Sum.sum();

 第一个输出的Sum.a是undefind，外部是没法获取咱们模块内部参数的，可是因为方法咱们返回成为一个对象，所以是能够由外部调用的。

同时该模块还能够为其添加新的方法

Sum=(function () {

        m3 = function () {
            alert("开始计算");
        };
        return {m3:m3}
    })(Sum);
        Sum.m3();

 可是注意，这里不能直接调用Sum中的变量a，b，若是须要使用这些参数还须要从新赋予，关于解决方式你们有好的办法欢迎回复。

另外为了不执行顺序等干扰形成程序报错，在添加方法时也能够写成

Sum=(function () {

        m3 = function () {
            alert("im");
        };
        return {m3:m3}
    })(window.Sum || {});

 这样即便是空对象也能够添加成功。

以上就是简单的模块化封装思路，你们能够触类旁通。