javascript单例模式

单例模式最初的定义出现于《设计模式》（艾迪生维斯理, 1994）：“保证一个类仅有一个实例，并提供一个访问它的全局访问点。”

这一模式的目的是使得类的一个对象成为系统中的唯一实例，并提供全局访问。

全局变量不是单例模式，但是在javascript开发中，我们经常会把全局变量当成单例来使用。但是全局变量会引起很多问题，很容易造成命名空间污染。

可以用以下方式可以相对降低全局变量带来的命名污染：

1.使用命名空间，减少全局变量的数量

    最简单的方法是使用对象字面量的方式。

2.使用闭包封装私有变量

透明的单例模式

var instance;var CreateDiv = function( html ){        if( instance ){return instance;}this.html = html;this.init();return instance = this;};CreateDiv.prototype.init = function(){var div = document.createElement( 'div' );        div.innerHTML = this.html;document.body.appendChild( div );};return CreateDiv;})();var a = new CreateDiv( 'lily3' );var b = new CreateDiv( 'lily2' );alert( a=== b);

这段代码中CreateDiv的构造函数创建对象和初始化init方法。而且保证了只有一个单例。但是这个构造函数只能创建一个实例。如果想要创建多个实例，就不得不修改构造函数。

这里引入代理类的方式，使CreateDiv函数变成普通的创建div的类。使用代理类来实现管理单例的代码，两个类结合在一起就组成单例模式。

var CreateDiv =(function(){var CreateDiv = function( html ){this.html = html;this.init();};CreateDiv.prototype.init = function(){var div = document.createElement( 'div' );div.innerHTML = this.html;document.body.appendChild( div );};var ProxySingletonCreateDiv = (function(){var instance;return function( html ){if( !instance ){instance = new CreateDiv( html );}return instance;}})();var a = new ProxySingletonCreateDiv( 'lily1');var b = new ProxySingletonCreateDiv( 'lily2' );alert( a=== b );

上述的单例模式的实现是基于面向对象语言实现的。但是对于javascript这种无类的语言来说，传统的单例模式并不适用。

惰性单例

惰性单例是指在需要的时候才创建实例对象。

Singleton.getInstance = (function(){    var instance = null;    return function( name ){        if( !instance ){            instance = new Singleton( name );        }        return instance;    }})();</span>

以上代码还是基于类的单例模式。

下面我们将创建实例和管理单例功能分隔开。

将创建悬浮窗的方法作为参数传入getSingle，

<button id ="login">登录</button>//将函数传入，并返回一个新的函数，并用变量result保存fn的计算结果，result在闭包中存在，所以不会被销毁，如果result已经存在，则直接返回这个值。var getSingle = function( fn ){   var result;   return function(){   return result || (result = fn.apply( this, arguments));   };};//创建悬浮窗var createLogin = function(){   var div = document.createElement( 'div' );   div.innerHTML = '登录悬浮窗';   div.style.display = 'none';   document.body.appendChild( div );   return div;};//<span style="font-family:KaiTi_GB2312;">将创建悬浮窗的方法作为参数传入getSingle</span>var createSingleLogin = getSingle( createLogin );//点击事件        document.getElementById( 'login' ).onclick = function(){       var login = createSingleLogin();       login.style.display = 'block';};

文章总结自《javascript设计模式与开发实践》，以后会继续跟进自己的实践总结。