模块化编程1

一,原始写法浏览器

模块就是实现特定功能的一组方法。函数

只要把不一样的函数(以及记录状态的变量)简单地放在一块儿,就算是一个模块。网站

function m1 () {对象

//.....继承

}io

function () {console

//......function

}变量

这是最初级的写法,这样m1(),m2(),组成一个模块。使用的时候,直接调用就好了,module

这种作法的缺点很明显:“污染”了全局变量,没法保证不与其余模块发生变量名冲突,并且模块成员之间看不出直接关系。

二,对象写法

为了解决上面的缺点,能够把模块写成一个对象,全部的模块成员都放到这个对象里面。

varmodule1 =  newObject({

_count :0,

m1 : function() {

},

m2 : function() {

}

});

上面的函数m1()和m2(),都封装在module1对象里。使用的时候,就是调用这个对象的属性。

module1.m1();

可是,这样的写法会暴露全部的模块成员,内部状态能够被外部改写。好比外部代码能够直接改变内部计数器的值。

module1._count = 5;

三,当即执行函数写法

使用“当即执行函数”,能够达到不暴露私有成员的目的。

var module1=(function() {

var _count = 0;

var m1 = function() {

console.log("m1");

};

var m2 = function() {

console.log("m2");

};

return{

m1 : m1,

m2 : m2

}

})();

使用上面的写法,外部代码没法读取内部的_count变量。

四,放大模式

若是一个模块很大,必须分红几个部分,或者一个模块须要继承另一个模块,这是就有必要采用“放大模式”。

var module1=(function(mod) {

mod.m3=function() {

console.log("m3");

}

return mod;

})(module1);

这样写其实就是给一个模块添加新的方法m3();能够用这种方式给一个模块扩展方法。

5.宽放大模式

在浏览器环境中,模块的各个部分一般都是从网上获取的,有时没法知道哪一个部分会先加载。若是采用上一节的写法第一个执行的部分可能加载一个不存在的空对象,这时就要采用“宽放大模式”。

var module1 = (function (mod){

return;

})(window.module1 || {});

与放大模式相比,“宽放大模式”就是”当即执行函数“的参数能够是空对象。

六,输入全局变量

独立性是模块的重要特色,模块内部最好不与程序的其余部分直接交互。为了在模块颞部调用全局变量,必须显式地将其余变量输入模块。

var module1 = (function ($,YAHOO)  {

//

})(jQuery, YAHOO);

上面的module1模块须要使用jQuery库和YUI库,就把这两个库(实际上是两个模块)看成参数输入module1。这样作除了保证模块的独立性,还使得模块之间的依赖关系变得明显。

注:这是我本身的一个360ssp网站,须要点访问量,但愿你们可以可以点击访问一下,支持一下。http://078156.top

相关文章
相关标签/搜索