JavaScript设计模式_01_单例模式

最近项目不太忙，难得有时间看看书，平时挺喜欢js这门语言。也看过很多高级教程，觉得自己还是比较热衷于js的设计模式。这一次重温一下《JavaScript设计模式与开发实践》，开篇为单例模式。

/**
 * pre 单例模式
 * 定义：保证一个类仅有一个实例，并提供一个访问它的全局访问点
 * 应用：单例模式是一种常用的模式，有一些对象我们往往只需要一个，
 * 比如线程池、全局缓存、浏览器中的 window 对象等。
 */
//--------------singleton-01-------------
/*写法1*/
var Singleton = function(name){
    this.name = name;
    this.instance = null;
};

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

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

var a = Singleton.getInstance("amy");
var b = Singleton.getInstance("ben");
alert(a === b);

// ------------singleton-02----------------
/*写法2*/
var Singleton = function(name){
    this.name = name;
}
Singleton.prototype.getName = function(){
    return this.name;
}

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

var a = Singleton.getInstance("amy");
var b = Singleton.getInstance("ben");
alert(a === b);

// ------------singleton03-----------
/*写法3*/
var Singleton = (function(){
    var instance;
    return function(name){
        if(instance){
            return instance;
        }
        this.name = name;
        instance = this;
    }
})();
var a = new Singleton("amy");
var b = new Singleton("ben");
alert(a === b);

//---------------- 示例  ---------------
var getSingleton = function(fn) {
    var result;
    return function() {
        if(!result) {
            result = fn.apply(this, arguments);
        }
        return result;
    }
};

var getSingletonVip = (function() {
    var instance;
    return function(fn) {
        return instance || (instance = fn.apply(this, arguments));
    }
})();

var createLoginUser = function() {
    var div = document.createElement("div");
    div.innerHTML = '这是登录框';
    document.body.appendChild(div);
    return div;
};

var createInfoGrid = function() {
    var div = document.createElement("div");
    div.innerHTML = '这是列表信息框';
    document.body.appendChild(div);
    return div;
};
//--执行getSingleton
var createUserDiv = getSingleton(createLoginUser);
createUserDiv();
createUserDiv();

//--执行getSingletonVip
getSingletonVip(createLoginUser);
getSingletonVip(createLoginUser);
posted @ 2017-06-09 10:04  Stinchan  阅读(236)  评论(0)  编辑  收藏  举报