设计模式——单例模式

单例模式

示例

描述

单例模式的思想在于保证一个特定类仅有一个实例, 这意味着第二次创建一个新对象时, 应该得到于与第一次创建的对象相同

单例的实现逻辑: 用一个变量来标志是否创建过对象, 如果是, 则在下次直接返回这个已经创建好的对象.

    var obj;
    if(!obj) {
        obj = xxx;
    }
    return obj;

案例

假设有一个需求是点击登录需要弹出一个登录框. 这个登录窗在页面里总是唯一的, 不可能同时存在两个登录窗口的情况

实现

var createLoginLayer = (function() {
    var div;
    return function() {

        if(!div) {
            div = document.createElement('div');
            div.innerHTML = '登录窗';
            div.style.display = 'none';
            document.body.appendChild( div );
        }

        return div;
    }
})();

通用的惰性单例

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

上面使用一个变量result来保存fn的计算结果. result变量因为身在闭包中, 它永远不会被销毁. 在将来的请求中, 如果result已经赋值, 那么它将返回这个值.

完善需求案例

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

var createSingleLoginLayer = getSingle( createLoginLayer );

document.getElementById('loginBtn').onclick = function() {
    var loginLayer = createSingleLoginLayer();
    loginLayer.style.display = 'block';
};