模块模式可以提供软件架构,为不断增长的代码提供组织形式。JavaScript没有提供package的语言表示,但我们可以通过模块模式来分解并组织 代码块,这些黑盒的代码块内的功能可以根据不断变化的软件需求而不断的被添加,替代和删除。模块模式由几种我们已经介绍过的模式共同组成:
- 命名空间模式
- 即时函数模式
- 私有成员与访问控制方法模式
- 依赖声明模式
模块模式的第一步是建立一个命名空间。首先我们用先前介绍的namespace()方法创建一个工具模块例子,这个例子模块提供一些数组功能:
MYAPP.namespace(‘MYAPP.utilities.array‘);
下一步就是定义这个模块。模块模式使用即时函数中的局部作用域来存放私有代码段。即时函数返回一个对象,该对象实际上就是被定义模块的公用接口,使用该模块的程序员可以通过这个对象来获得该模块提供的功能:
MYAPP.utilities.array = (function () { return { // todo... }; }());
下面为这个模块增加一些公有的方法:
MYAPP.utilities.array = (function () { return { inArray: function (needle, haystack) { // ... }, isArray: function (a) { // ... } }; }());
利用即时函数提供的局部作用域,可以在即时函数体的上部,给出模块的依赖关系,私有属性,以及需要初始化的代码。最后,这个即时函数返回需要创建的模块的公有访问接口对象:
MYAPP.namespace(‘MYAPP.utilities.array‘); MYAPP.utilities.array = (function () { // dependencies var uobj = MYAPP.utilities.object, ulang = MYAPP.utilities.lang, // private properties array_string = "[object Array]", ops = Object.prototype.toString; // private methods // ... // end var // optionally one-time init procedures // ... // public API return { inArray: function (needle, haystack) { for (var i = 0, max = haystack.length; i < max; i += 1) { if (haystack[i] === needle) { return true; } } }, isArray: function (a) { return ops.call(a) === array_string; } // ... more methods and properties }; }());
以上就是模块模式的基本思路。模块模式是组织JavaScript代码的常用模式,推荐在软件开发中经常使用。
1. 模块的揭露模式
上面的模块模式例子中,公有方法是直接声明的。结合之前介绍的揭露模式,可以把所有模式中的方法都先声明为私有,然后再通过揭露模式,把私有的方法通过公有的接口方法展示出来。据此,上面的例子可以这样写:
MYAPP.utilities.array = (function () { // private properties var array_string = "[object Array]", ops = Object.prototype.toString, // private methods inArray = function (haystack, needle) { for (var i = 0, max = haystack.length; i < max; i += 1) { if (haystack[i] === needle) { return i; } } return ?1; }, isArray = function (a) { return ops.call(a) === array_string; }; // end var // revealing public API return { isArray: isArray, indexOf: inArray }; }());
2. 通过构造函数创建的模块
以上的例子中都是直接返回对象,有时候使用构造函数要更方便一些。使用构造函数的模块模式与上面例子的区别就在于返回的是一个函数,而不是一个字面声明的对象:
MYAPP.namespace(‘MYAPP.utilities.Array‘); MYAPP.utilities.Array = (function () { // dependencies var uobj = MYAPP.utilities.object, ulang = MYAPP.utilities.lang, // private properties and methods... Constr; // end var // optionally one-time init procedures // ... // public API -- constructor Constr = function (o) { this.elements = this.toArray(o); }; // public API -- prototype Constr.prototype = { constructor: MYAPP.utilities.Array, version: "2.0", toArray: function (obj) { for (var i = 0, a = [], len = obj.length; i < len; i += 1) { a[i] = obj[i]; } return a; } }; // return the constructor // to be assigned to the new namespace return Constr; }());
使用构造函数来声明的模块,可以这样调用:
var arr = new MYAPP.utilities.Array(obj);
3. 把global对象引入到模块中
模块声明时使用的即时函数可以接受需要的参数,这些参数可以根据设计的需要来引入。一个常用的做法是把global作为参数引入进来,这样全局对象就本地化了(Localized),可以加速对全局变量的访问:
MYAPP.utilities.module = (function (app, global) { // references to the global object // and to the global app namespace object // are now localized }(MYAPP, this));