模块化的方法

什么是模块化：
具有相同属性和行为的事物的集合。在前端中，将一些属性和行为比较类似的内容放在同一个js文件里面，把这个js文件称为模块，每个js文件各司其职。
模块要有几个特点：独立、完整、依赖关系
1、函数(只能实现小的功能，如果要实现大功能就显得比较零散)

function add(a,b){
    return a+b;
}
function a(a){
    return a;
}

2、对象

var obj = {
    len: 3,
    init: function(){},
    bind: function(){}   
}//这样写有弊端，如果我在外面 obj.len = 5,可以改变里面的值

3、匿名函数

(function(){
    var len = 2;
    function add(a,b){
        return a+b;
    }
})(); //这样的做法就不可以改变len了 但是取不到 len 
console.log(len); //报错

另外一种方法：（这种方法可以私有化变量）

    var p =(function(){
        var len = 2;
        function add(a,b){
            return a+b;
        }
        return {
            add: add //如果没有return会报错
        }
    })();
console.log(p.add(1,2)); //-->3

4、依赖（JQuery实现）

(function(a,b){
    b(a);
})(window,function(window){
    window.JQuery = JQuery;
    function JQuery(){}
});

函数–>对象的写法，可以改变对象里面的东西 –>匿名函数 return出去

现在有了更好的规范；在最开始的阶段，Js并没有这些模块机制，只有原生代码，得不到有效妥善的管理。后来就有了CommonJs和AMD，组件开发等等。这些都是为了让我们更高效地开发以及便于团队的协作等等。

模块化的方法

模块化的方法

猜你喜欢