javascript 模块化常见写法

参考阮一峰老师的文字 http://www.ruanyifeng.com/blog/2012/10/javascript_module.html

1,采用对象的方式进行模块封装,由于有了命名空间,所以不会污染到其他空间。

var module = {

n : 0,

m1 : function (){
      //...
    },

m2 : function (){
      //...
    }

};

module.m1();//调用该模块的方法

但是module.n = 100;//这样就修改了模块内部的变量值。所以不太好。

2,采用立刻执行的函数的写法(闭包)

var module = (function(){

var n = 0;

var m1 = function(){
      //...
    };

var m2 = function(){
      //...
    };

return {
      m1 : m1,
      m2 : m2
    };

})();

这样就没法改变n的值了。

3,对已有模块进行添加方法之类的,或者在已有模块的基础上进行添加和改造(继承自原对象),返回一个新对象。

var module1 = (function (mod){ //或var module2 = ....

mod.m3 = function () {
      //...
    };

return mod;

})(module1);

上面的代码将module1模块传入以后,进行加工,添加了一个新方法m3(),然后返回新的module1模块。

如果担心引入的module可能是不存在的,可以

var module1 = (function(mod){

//...

})(window.module1 || {}); //参数可以为空对象

4,保证模块独立性,为了在模块内部调用全局变量,显式地将其他变量输入模块。

var module1 = (function ($, YAHOO) {

//...

})(jQuery, YAHOO);

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容