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

JavaScript中的创建对象的基本方法有字面声明(Object Literal)和构造函数两种,但JavaScript并没有特别的语法来表示如命名空间、模块、包、私有属性、静态属性等等面向对象程序设计中的概 念。为了让JavaScript实现面向对象程序中的高级语义,人们发明了命名空间模式、依赖声明模式,模块模式,以及沙盘模式。

1. 命名空间模式

命 名空间模式解决了JavaScript中的两个问题,一是全局变量污染的问题,二是可能的名字冲突问题。虽然JavaScript没有特别支持命名空间, 但命名空间模式在JavaScript中并不难实现。为了不过多使用全局变量,可以把程序中所有使用到的全局变量组织到一个(最好是一个程序只有一个)全 局的对象中去。接下来,要访问需要的变量,就可以通过这个对象来得到引用:

// BEFORE: 5 globals
// Warning: antipattern
// constructors
function Parent() {}
function Child() {}
// a variable
var some_var = 1;
// some objects
var module1 = {};
module1.data = {a: 1, b: 2};
var module2 = {};

上面的代码里有5个全局变量,有全局的对象,也有全局的简单类型的变量。下面建立一个全局对象,名字比如说叫MYAPP,然后把上面的5个全局变量都组织到MYAPP里:

// AFTER: 1 global
// global object
var MYAPP = {};
// constructors
MYAPP.Parent = function () {};
MYAPP.Child = function () {};
// a variable
MYAPP.some_var = 1;
// an object container
MYAPP.modules = {};
// nested objects
MYAPP.modules.module1 = {};
MYAPP.modules.module1.data = {a: 1, b: 2};
MYAPP.modules.module2 = {};

这个全局对象的名字,可以选择使用程序的名字,也可以用域名,也可以用公司名。通常这个全局对象的名字是全大写的,以便看起来醒目些,但它并不是常量(常量通常也是全大写的)。

这种模式可以很好的解决命名冲突的问题,因为不同程序或公司的代码里使用的变量,都被组织到不同的全局对象中,因此许多JavaScript的库都是用这种方式来组织API的。但这种模式也有些小问题:

  • 变量使用起来需要敲更多的字母,js文件也因此变得更大;
  • 只有一个全局变量使得所有的代码都可以使用它并修改它,这种修改可以即时生效;
  • 长的嵌套的名字使得变量的解析过程需要更长的时间。

后面还将介绍的沙盘模式将应对这些问题。

2. 通用的命名空间函数

当程序变得越来越大之后,使用这个变量之前才在全局对象中声明它变得不再安全:一些属性和对象可能已经在全局对象中存在,重新声明它将把它原有的内容覆盖,因此我们在声明变量时就需要先做个简单的检查:

// unsafe
var MYAPP = {};
// better
if (typeof MYAPP === "undefined") {
    var MYAPP = {};
}
// or shorter
var MYAPP = MYAPP || {};

上面的检查是简单有效的,但十分繁琐: 在使用MYAPP.modules.module2这前,需要做3次检查。因此就需要有一个叫namespace()的函数,在每次使用声明一个模块或变量之前,做相应的检查:

// using a namespace function
MYAPP.namespace(‘MYAPP.modules.module2‘);
// equivalent to:
// var MYAPP = {
//     modules: {
//         module2: {}
//     }
// };

下面就是一个通用的namespace()函数的实现:

var MYAPP = MYAPP || {};
MYAPP.namespace = function (ns_string) {
    var parts = ns_string.split(‘.‘),
        parent = MYAPP,
        i;
    // strip redundant leading global
    if (parts[0] === "MYAPP") {
        parts = parts.slice(1);
    }
    for (i = 0; i < parts.length; i += 1) {
        // create a property if it doesn‘t exist
        if (typeof parent[parts[i]] === "undefined") {
            parent[parts[i]] = {};
        }
        parent = parent[parts[i]];
    }
    return parent;
};

有了上面的namespace()函数,我们就可以这样做了:

// assign returned value to a local var
var module2 = MYAPP.namespace(‘MYAPP.modules.module2‘);
module2 === MYAPP.modules.module2; // true
// skip initial `MYAPP`
MYAPP.namespace(‘modules.module51‘);
// long namespace
MYAPP.namespace(‘once.upon.a.time.there.was.this.long.nested.property‘);

这样我们就声明了一个很长的嵌套命名空间:

时间: 2024-12-21 02:04:21

JavaScript基础对象创建模式之命名空间(Namespace)模式(022)的相关文章

JavaScript基础对象创建模式之声明依赖模式(023)

运用了命名空间(Namespace)模式后, 就可以使用一些JavaScript库了,比如YAHOO作用YUI2库的全局对象,可以通过 YAHOO.util.Dom 和 YAHOO.util.Event得到YUI2库中有关Dom和事件的支持.在程序中使用这些模块就是声明依赖(Declaring Dependencies)模式: var myFunction = function () { //dependencies var event = YAHOO.util.Event, dom = YAH

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

模块模式可以提供软件架构,为不断增长的代码提供组织形式.JavaScript没有提供package的语言表示,但我们可以通过模块模式来分解并组织 代码块,这些黑盒的代码块内的功能可以根据不断变化的软件需求而不断的被添加,替代和删除.模块模式由几种我们已经介绍过的模式共同组成: 命名空间模式 即时函数模式 私有成员与访问控制方法模式 依赖声明模式 模块模式的第一步是建立一个命名空间.首先我们用先前介绍的namespace()方法创建一个工具模块例子,这个例子模块提供一些数组功能: MYAPP.na

JavaScript基础对象创建模式之沙盘模式(026)

沙盘模式可以弥补命名空间模式中的两项不足之处: 使用唯一全局对象作为程序的全局变量入口,使得无法在同一程序中使用两个不同版本的API,因此它们使用的是同一个唯一的全局对象名,如MYAPP: 较长的嵌套对象使得代码编写和解析都比较慢: 沙盘模式,正如其名字所说,提供了一个各类模块可以共同“游戏”的环境,模块之间和沙盘之间不会相互影响. 这种模式在YUI3中大量被使用.下面介绍一种沙盘模式的实现方式: 1. 全局的构造函数 在命名空间模式中只有一个全局对象:在沙盘模式中,唯一的是一个全局的构造函数:

JavaScript基础对象创建模式之单体/单例模式(Singleton)

首先,单例模式是对象的创建模式之一,此外还包括工厂模式.单例模式的三个特点: 1,该类只有一个实例 2,该类自行创建该实例(在该类内部创建自身的实例对象) 3,向整个系统公开这个实例接口 Java中大概是这个样子: class Singleton { //私有,静态的类自身实例 private static Singleton instance = new Singleton(); //私有的构造子(构造器,构造函数,构造方法) private Singleton(){} //公开,静态的工厂方

JavaScript基础对象创建模式之私有属性和方法(024)

JavaScript没有特殊的语法来表示对象的私有属性和方法,默认的情况下,所有的属性和方法都是公有的.如下面用字面声明的对象: var myobj = { myprop: 1, getProp: function () { return this.myprop; } }; console.log(myobj.myprop); // `myprop` is publicly accessible console.log(myobj.getProp()); // getProp() is publ

JavaScript基础对象创建模式之静态成员(027)

在支持“类”的面向对象语言中,静态成员指的是那些所有实例对象共有的类成员.静态成员实际是是“类”的成员,而非“对象”的成员.所以如果 MathUtils类中有个叫 max()的静态成员方法,那么调用这个方法的方式应该是这样的:MathUtils.max(3, 5). 1. 公有静态成员 JavaScript里并没有“类”的实际语言表示 ,所以也就没有静态成员的语义表示.但由于构造函数本身就是个对象,如果把构造函数看成“类”,那么它的成员就是可以通过“类”名(也就是构造函数)直接访问的“静态成员”

JavaScript基础对象创建模式之链式调用模式(Chaining Pattern)(029)

链式调用模式允许一个接一个地调用对象的方法.这种模式不考虑保存函数的返回值,所以整个调用可以在同一行内完成: myobj.method1("hello").method2().method3("world").method4(); 如果对象中有些方法不需要有返回值,就可以让它返回this引用,这个this引用就可以方便继续调用下一个方法: var obj = { value: 1, increment: function () { this.value += 1;

JavaScript基础对象创建模式之对象的常量(028)

虽然许多编程语言提供了const关键字来支持常量的声明,但JavaScript里没有表示常量的语义.我们可以用全大写的方式来声明变量,表明它实际上是个常量: Math.PI; // 3.141592653589793 Math.SQRT2; // 1.4142135623730951 Number.MAX_VALUE; // 1.7976931348623157e+308 通常这种常量会用对象来包装起来:比如上面的Math.要实现程序里需要的常量,可以这样做: // constructor va

javascript基础-对象

原理 万物皆为对象.假设将'莫德'(我)看成对象.莫德的属性有名字,性别,年龄等. 莫德的行为有吃饭,走路,睡觉等.莫德与他人的往来即对象间的交互.对象对应世界的一个实体.类,即管理对象的分类.如果莫德是具体的对象.男人即类.人即接口. 构建方式 单例对象:JSON 普通对象: (function(w,M){ M.InviteFriends = function(){ //构造函数 function InviteFriends(){}; //原型 InviteFriends.prototype