模块化的方法

模块化的方法

什么是模块化
具有相同属性和行为的事物的集合。在前端中,将一些属性和行为比较类似的内容放在同一个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,组件开发等等。这些都是为了让我们更高效地开发以及便于团队的协作等等。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值