模块化的JavaScript编码风格

JavaScript语言本身没有提供有效的代码管理机制,这在一定程度上限制了它的发展,不过现在许多资深的JavaScript程序员已经提出了许多优秀的模块化管理机制。

实际上,不同的人具有不同的编码风格,只要是适合自身的编码风格,就是最易于维护的代码,不够考虑到通用化,在团队内部还是希望规范化一种编码风格,以便更多的人参与到代码维护中来或者更易于理解团队其他人的代码。

起初,我还是一个菜鸟的时候,我这样编写JavaScript代码:

function func1() {...};

function func2() {...};

....

可以看到,这种编写风格会在全局作用域中定义了许多全局变量,不利于团队合作开发,不利于维护。

后来,我成为了一个入门者,我这样编写JavaScript代码:

var Sandbox = {

        public_var2: 1,

        publick_var2: 2,

        ...

        func1: function() {  

       },

        func2: function() {

        },  

        ....

};

可以看到,这种编写风格无法维护私有变量,并且在模块加载完毕之后,会立即执行代码。

现在,我是一个进阶者了(自我评定的,哈哈),我这样编写JavaScript代码:

(function(host) {

      var base = base || {};

      base.mod1  = function(config) {

             var private_var1;

             var private_var2;

             ....          

             var o = {};    //这里可以定义一个新对象,也可以继承自父对象

            //例如var o = new Parent();,可以任何方式继承,只要返回一个对象即可(Parent是一个全局可见的构造器)

            //当然为了可以继承自其他父对象,我们可以将易变的Parent分离出来,放到config配置项中

            //形如var o = new config.Parent();   

             //因为,我们通常是在初始化函数中启动模块程序(或者说组件)

             //所以,我们就可以在外部添加新方法或者覆盖方法

             //一般做法是先调用base.mod1(config1)获得一个对象实例后,

            //再调用实例的init方法。

              o.init = function() {};

             //添加自对象的方法或者覆盖父对象的方法

            o.func1 = function() {};

            o.func2 = function() {};

            return o;

     };

      base.mod2 = function(config) {

            //同上....

      };

     host.base = base;

})(this);

可以看到,这种编码风格已经可以大致满足代码管理、私有变量维护、继承等的需求了。。。应该可以算得上是模块化了吧,呵呵!

执行完以上代码后,如果我们想用mod1,我们就可以使用base.mod1(config)来生成模块实例:

var mod1 = base.mod1(config);

//覆盖func1

mod1.func1 = function() {};

//启动模块程序,一般是在初始化函数中,绑定一些事件处理器等。

//此时如果在init函数中用到func1,那么用到的就是上述覆盖的新方法,而不是实例默认的方法了。

mod1.init();

 

以上是我的一点小小的经验,欢迎拍砖。。。。。。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值