js设计模式之单例模式

前沿

总在想应该留点什么下来,是自己变懒了许多,终于想着更新了……
今天想写写js设计模式之单例模式,以下属个人见解,不正确的地方望指正。

单例模式

1、定义:保证一个类仅有一个实例,并提供一个访问它的全局访问点

2、实现单例模式

var Singleton = function( name ){
    this.name = name;
    this.instance = null;
};

Singleton.prototype.getName = function(){
    alert( this.name );
};

Singleton.getInstance = function( name ){
    //使用this.instance这个变量来标志当前是否已为某个类创建过对象,如果是,则在下一次获取该类的实                        
    //例时,直接返回之前创建的对象。
    if ( !this.instance ){
        this.instance = new Singleton( name );
    }
    return this.instance;
};

var a = Singleton.getInstance( 'sven1' );
var b = Singleton.getInstance( 'sven2' );

alert( a === b ); //true

或者:

var Singleton = function( name ){
    this.name = name;
};

Singleton.prototype.getName = function(){
    alert( this.name ); 
};

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

我们通过Singleton.getInstance来获取Singleton类的唯一对象,这种方式相对简单,但增加类这个类的“不透明性”,使用者必须知道这是一个类,并且通过Singleton.getInstance来获取对象。

2、透明的单例模式
我们将使用CreateDiv单例类,它的作用是负责在页面中创建唯一的div节点。

var CreateDiv = (function(){
    var instance;
    
    //1、创建对象与执行初始化init方法
    //2、保证只有一个对象
    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( 'sven1' );
var b = new CreateDiv( 'sven2' );
alert( a === b ); //true

这些写的缺点:
若某天我们需要这个类创建千千万万的div,那我们必须得改写CreateDiv构造函数。

3、用代理实现单例模式

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 );
};

//引入代理类proxySingletonCreateDiv
var ProxySingletonCreateDiv = (function(){
    var instance;
    return function( html ){
        if ( !instance ){
            instance = new CreateDiv( html );
        }
        return instance;
    }
})();

var a = new ProxySingletonCreateDiv( 'sven1' );
var b = new ProxySingletonCreateDiv( 'sven2' );
alert( a === b ); //true

JavaScript中的单例模式

1、通用惰性单例
定义:在需要的时候才创建对象实例。

//用一个变了result来保持fn的计算结果,result变量因为身在闭包中,它永远不会被销毁。在将来的请求 
//中。如果result已被赋值,那么它将返回这个值
var getSingle = function( fn ){
    var result;
    return function(){
        return result || fn.apply(this, arguments);
    }
};

var createLoginLayer = function(){
    var div = document.createElement( 'div' );
    div.innerHTML = "我是登录浮窗";
    div.style.display = 'none';
    document.body.appendChild( div );
    return div;
}

var createSingleLoginLayer = getSingle( createLoginLayer );

这样我们不仅可以创建createLoginLayer,还可以创建createScript、createIframe等。

总结

单例模式是一种简单但非常实用的模式,getSingle函数中主要使用了闭包和高阶函数的概念。

相关文章

此处评论已关闭