模块模式可以提供软件架构,为不断增长的代码提供组织形式。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));

转载地址:http://zihui.lin.blog.163.com/blog/static/7292115420127781426279/

对象创建模式之模块模式(Module Pattern)的更多相关文章

  1. 初涉JavaScript模式 (11) : 模块模式

    引子 这篇算是对第9篇中内容的发散和补充,当时我只是把模块模式中的一些内容简单的归为函数篇中去,在北川的提醒下,我才发觉这是非常不严谨的,于是我把这些内容拎出来,这就是这篇的由来. 什么是模块模式 在 ...

  2. javascript模式之模块模式

    使用模式来组织代码有很多优点:使代码的结构更清晰,逻辑性更强,更容易维护.还可以避免很多错误. 首先,在javascript主要分为两大类: 编程模式-- 一些专门为javascript语言开发出的最 ...

  3. JavaScript基础对象创建模式之模块模式(Module Pattern)(025)

    模块模式可以提供软件架构,为不断增长的代码提供组织形式.JavaScript没有提供package的语言表示,但我们可以通过模块模式来分解并组织 代码块,这些黑盒的代码块内的功能可以根据不断变化的软件 ...

  4. 【JavaScript回顾】对象创建的几种模式

    组合使用构造函数模式和原型模式 创建自定义类型的常见方式,就是组合使用构造函数模式与原型模式.构造函数模式用于定义实 例属性,而原型模式用于定义方法和共享的属性.结果,每个实例都会有自己的一份实例属性 ...

  5. Eclipse创建Maven多模块工程Module开发(图文教程)

    自己研究了下Eclipse用Maven多模块工程Module开发,跟大家分享一下! 功能模块来分Module,跟java的package类似,一般是按照的功能模块分module,比如:sso/cas/ ...

  6. 《JavaScript 模式》读书笔记(5)— 对象创建模式2

    这一篇,我们主要来学习一下私有属性和方法以及模块模式. 三.私有属性和方法 JavaScript并没有特殊的语法来表示私有.保护.或公共属性和方法,在这一点上与Java或其他语言是不同的.JavaSc ...

  7. 《JavaScript 模式》读书笔记(5)— 对象创建模式4

    我们学完了大部分对象创建模式相关的内容,下面还有一些小而精的部分. 七.对象常量 JavaScript中没有常量的概念,虽然许多现代的编程环境可能为您提供了用以创建常量的const语句.作为一种变通方 ...

  8. JavaScript基础对象创建模式之命名空间(Namespace)模式(022)

    JavaScript中的创建对象的基本方法有字面声明(Object Literal)和构造函数两种,但JavaScript并没有特别的语法来表示如命名空间.模块.包.私有属性.静态属性等等面向对象程序 ...

  9. JavaScript设计模式-单例模式、模块模式(转载 学习中。。。。)

    (转载地址:http://technicolor.iteye.com/blog/1409656) 之前在<JavaScript小特性-面向对象>里面介绍过JavaScript面向对象的特性 ...

随机推荐

  1. Vulkan SDK 之 DrawCube

    Waiting for a Swapchain Buffer Beginning the Render Pass Bind the Pipeline Bind the Descriptor Sets ...

  2. 二、react开发环境配置与webpack入门

    Webpack 模块打包工具(module bundler)功能: 将 CSS.图片与其他资源打包 打包之前预处理(Less.CoffeeScript.JSX.ES6 等)档案 依 entry 文件不 ...

  3. JS location.href传参及接受参数

    当前页面传参 window.location.href= + "&name="+"zhangchenxao"; 下个页面接受参数 var url = l ...

  4. HDU 5455:Fang Fang 查cff个数

    Fang Fang Time Limit: 1500/1000 MS (Java/Others)    Memory Limit: 65535/32768 K (Java/Others) Total ...

  5. BZOJ:2815: [ZJOI2012]灾难

    题解: 构造灭绝树: x指向的点表示x的祖先死亡则x死亡 动态LCA: 可以用LCT维护或直接更新倍增数组 最后统计子树点的个数 坑: 我还不会序列型Toposort #include<iost ...

  6. DCGAN

    Deep Convolutional Generative Adversarial Networks we introduced the basic ideas behind how GANs wor ...

  7. linux提交代码到github

    1.首先你得注册个github账户 .... 2.新建项目(可以选择私有或者公开的) 3.上述github代码仓库建立好了 ,就回到自己的linux服务器 3.1  在自己的项目目录里 qi 3.1. ...

  8. Linux下MSSQL部署

    目前主要使用的red hat系列的linux版本,CentoS 7.X,MSSQL2017 微软官方说明地址:https://docs.microsoft.com/zh-cn/sql/linux/qu ...

  9. Maven - Eclipse例子

    版权所有,未经授权,禁止转载 章节 Maven – 简介 Maven – 工作原理 Maven – Repository(存储库) Maven – pom.xml 文件 Maven – 依赖管理 Ma ...

  10. JavaBean和json数据之间的转换(一)简单的JavaBean转换

    1.为什么要使用json? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,因为其高性能.可读性强的原因,成为了现阶段web开发中前后端交互数据的主要数据 ...