在JavaScript里,实现单例的方式有很多种,其中最简单的一个方式是使用对象字面量的方法,其字面量里可以包含大量的属性和方法:

var her = {
     property1: 'someing',
     property2: 'someing else',
     method1: function(){
          console.log('hello, Javascript');
     }
}

如果以后要扩展该对象,你可以添加自己的私有成员和方法,然后使用闭包在其内部封装这些变量和函数声明。只暴露你想暴露的public成员和方法,样例代码如下:

var mySingletion = function(){
    /*  这里声明私有变量和方法 */
    var privateVariable  = 'something private';
    function showPrivate(){
        console.log(privateVariable );
    }

    /* 共有变量和方法(可以访问私有变量和方法) */
    return {
        publicMethod: function(){
            showPrivate();
        },
        publicVar: 'the public can see this'
    }
}

var single = mySingletion ();
single.publicMethod(); // 'something private'
console.log(single.publicVar); //  'the public can see this' 

上面的代码很不错了,但如果我们想做到只有在使用的时候才初始化,那该如何做呢?为了节约资源的目的,我们可以另外一个构造函数里来初始化这些代码,如下:

var Singleton = (function(){
    var instantiated;
    function init(){
        /* 这里定义单例代码 */
        return {
            publicMethod: function(){
                 console.log('Hello, javascript');
            },
            publicProperty: 'test'
        }
    }

    return {
         getInstance: function(){
              if( !instantiated ){
                    instantiated = init();
              }
              return instantiated ;
         }
    }    

})();
/*  调用共有的方法来获取实例 */
Singleton.getInstance().publicMethod();

知道了单例如何实现了,但单例用在什么样的场景比较好呢?其实单例一般是用在系统间各种模式的通信协调上,下面的代码是一个单例的最佳实践:

var SingletonTester = (function(){
    // 参数:传递给单例的一个参数集合
    function Singleton(args){
        // 设置args变量接受的参数或者为空
        var args = args || {};
        // 设置name参数
        this.name = 'SingletonTester';
        // 设置pointX的值
        this.pointX = age.pointX || 6;
        // 设置pointY的值
        this.pointY = age.pointY || 10;
    }

    // 实例容器
    var instance;

    var _static = {
        name: 'SingletonTester',
        // 获取实例的方法
        // 返回Singleton的实例
        getInstance: function(args){
            if( instance === undefined ){
                  instance  = new Singleton(args);
            }
            return instance;
        }
    }    

    return _static;    

})();

var singletonTest = SingletonTester.getInstance({ pointX: 5 });
console.log(singletonTest.pointX); // 输出5

其他的实现方式:

方法1:

function Universe() {

    // 判断是否存在实例
    if (typeof Universe.instance === 'object') {
        return Universe.instance;
    }

    // 其它内容
    this.start_time = 0;
    this.bang = "Big";

    // 缓存
    Universe.instance = this;

    // 隐式返回this
}

// 测试
var uni = new Universe();
var uni2 = new Universe();
console.log(uni === uni2); // true

方法2:

function Universe() {

    // 缓存的实例
    var instance = this;

    // 其它内容
    this.start_time = 0;
    this.bang = "Big";

    // 重写构造函数
    Universe = function () {
        return instance;
    };
}

// 测试
var uni = new Universe();
var uni2 = new Universe();
uni.bang = "123";
console.log(uni === uni2); // true
console.log(uni2.bang); 

方法3:

function Universe() {

    // 缓存实例
    var instance;

    // 重新构造函数
    Universe = function Universe() {
        return instance;
    };

    // 后期处理原型属性
    Universe.prototype = this;

    // 实例
    instance = new Universe();

    // 重设构造函数指针
    instance.constructor = Universe;

    // 其它功能
    instance.start_time = 0;
    instance.bang = "Big";

    return instance;
}

// 测试
var uni = new Universe();
var uni2 = new Universe();
console.log(uni === uni2); // true

// 添加原型属性
Universe.prototype.nothing = true;

var uni = new Universe();

Universe.prototype.everything = true;

var uni2 = new Universe();

console.log(uni.nothing); // true
console.log(uni2.nothing); // true
console.log(uni.everything); // true
console.log(uni2.everything); // true
console.log(uni.constructor === Universe); // true

方法4:

var Universe;

(function () {

    var instance;

    Universe = function Universe() {

        if (instance) {
            return instance;
        }

        instance = this;

        // 其它内容
        this.start_time = 0;
        this.bang = "Big";
    };
} ());

//测试代码
var a = new Universe();
var b = new Universe();
alert(a === b); // true
a.bang = "123";
alert(b.bang); 

javascript --- 设计模式之单体模式(二)的更多相关文章

  1. javascript --- 设计模式之单体模式(一)

    单体是一个用来划分命名空间并将一些相关的属性与方法组织在一起的对象,如果她可以被实例化的话,那她只能被实例化一次(她只能嫁一次,不能二婚). 单体模式是javascript里面最基本但也是最有用的模式 ...

  2. javascript设计模式之单体模式

    一入前端深似海,刚入前端,以为前端只是div+css布局外加jquery操作DOM树辣么简单.伴随着对前端学习的深入,发现前端也是博大精深,而且懂得越多,才发现自己越无知,所以一定不能停下脚步的学习. ...

  3. javascript设计模式(单体模式)

    主要内容: js中最基本.应用最广的模式就是单体模式,实现原理是将代码组织为一个逻辑单元,这个逻辑单元中的代码可以通过单一的变更进行访问,确保对象只存在一份实例. 单体模式的特点: 在网页中使用全局变 ...

  4. Javascript设计模式(2)-单体模式

    单体模式 1. js最简单的单体模式 对象字面量:把一批有一定关联的方法和属性组织在一起 // 对象字面量 var Singleton = { attr1: true, attr2: 10, meth ...

  5. JS设计模式——5.单体模式

    JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html   单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...

  6. JavaScript设计模式之----组合模式

    javascript设计模式之组合模式 介绍 组合模式是一种专门为创建Web上的动态用户界面而量身制定的模式.使用这种模式可以用一条命令在多个对象上激发复杂的或递归的行为.这可以简化粘合性代码,使其更 ...

  7. JS设计模式之单体模式(Singleton)

    单体模式作为一种软件开发模式在众多面向对象语言中得到了广泛的使用,在javascript中,单体模式也是使用非常广泛的,但是由于javascript语言拥有其独特的面向对象方式,导致其和一些传统面向对 ...

  8. 从ES6重新认识JavaScript设计模式(三): 建造者模式

    1 什么是建造者模式? 建造者模式(Builder)是将一个复杂对象的构建层与其表示层相互分离,同样的构建过程可采用不同的表示. 建造者模式的特点是分步构建一个复杂的对象,可以用不同组合或顺序建造出不 ...

  9. JavaScript 设计模式之----单体(单例)模式

    设计模式之--单体(单例)模式 1.介绍 从本章开始,我们会逐步介绍在JavaScript里使用的各种设计模式实现,在这里我不会过多地介绍模式本身的理论,而只会关注实现.OK,正式开始. 在传统开发工 ...

随机推荐

  1. Qt编写自定义控件二动画按钮

    现在的web发展越来越快,很多流行的布局样式,都是从web开始的,写惯了Qt widgets 项目,很多时候想改进一下现有的人机交互,尤其是在现有的按钮上加一些动画的效果,例如鼠标移上去变大,移开还原 ...

  2. 用SQL server导出到oracle,查询时提示“表或视图不存在ORA-00942”错误

    用SQL server2005的导出工具,将数据导出表到oracle,表名称里看到有这张表了,但查询或删除时都提示“ORA-00942表或者试图不存在”的错误,上网查了一下,是如下原因: “查询或删除 ...

  3. 二十三、【开源】EFW框架Web前端开发之常用组件(FusionCharts图表、ReportAll报表等)

    回<[开源]EFW框架系列文章索引>        EFW框架源代码下载V1.2:http://pan.baidu.com/s/1hcnuA EFW框架实例源代码下载:http://pan ...

  4. ps图像渐变

    整理自:http://zhidao.baidu.com/question/16374167.html 1.用ps打开图片 2.在切换至英文输入法状态下(下面的操作均如此)按q 快捷键q的作用是切换标准 ...

  5. ECMAScript5新增对象语法糖getter和setter

    在新的ECMAScript5中新添加了两个语法糖,这两个语法糖是这样的. var obj = (function(){ var num = 10; return { get n(){ return n ...

  6. Table_EXISTS_ACTION=APPEND时导入数据时

    11g对数据泵新增了一些功能.这篇介绍新增的选项DATA_OPTIONS=SKIP_CONSTRAINT_ERRORS. Oracle11g的数据泵新增了一个DATA_OPTIONS选项,目前只有一个 ...

  7. react native下android开发环境搭建

    关于react native环境搭建我也是参考这篇文章的,但我这里就出现了很多在这篇文章里没有出现的问题,也是坑比较多.但最后在一位大神的帮助下还是成功运行了. 1.第一个坑就是有些文件下载需要VPN ...

  8. bootstrap插件学习-bootstrap.tooltip.js

    先看bootstrap-tooltip.js的结构 var Tooltip = function ( element, options ){} // 构造器 Tooltip.prototype ={} ...

  9. [linux]scp指令

    实例1:从远处复制文件到本地目录 $scp root@10.6.159.147:/opt/soft/demo.tar /opt/soft/ 说明: 从10.6.159.147机器上的/opt/soft ...

  10. 在eclipse中配置python插件

    最好离线下载python的离线包.名字叫——org.python.pydev.feature-1.6.3.2010100513 此包里面有两个文件夹 features 和 plugins,分别把2包中 ...