JavaScript之单例模式

单例模式定义： 保证一个类只能有一个实例，并提供一个访问它的全局方法。

试想一下，当我们单击登陆按钮的时候，页面会出现一个登陆框，这个登陆框是唯一的，无论单击多少次按钮都只有一个窗口，这个登陆窗口就是单例模式。

---

惰性单例模式：

惰性单例模式是指只有在需要的时候才会创建对象实例。instance实例对象总是在我们调用Single.getInstance时候才会被创建。

        var Single = function (name) {
            this.name = name;

        }

        Single.prototype.getName = function () {
            console.log(this.name);
        }

        Single.getInstance = (function () {
            var instance = null;

            return function (name) {
                if (!instance) {
                    instance = new Single(name);
                }

                return instance;
            }
        }())

        var a = Single.getInstance('a');
        var b = Single.getInstance('b');
        console.log(a === b); // true

但是这个是基于类的单例模式，但是js是一门无类的语言，这种并不适用，现在我们用一个适用js的单例模式写登陆框。

var Login = (function () {
    var div;
    return function () {
        if (!div) {
            div = document.createElement('div');
            div.innerHTML = '登陆框';
            div.style.display = 'none';
            document.body.appendChild(div);
        }

        return div;
    }
}());

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

这样写还有一个问题，那就是这不符合开放封闭原则， 开闭原则 通俗点的解释就是不能修改，但是可以扩展，试想按照我们现在的写法如果下次想改为创建一个iframe或script标签就需要把Login方法全部重写一遍，这样显然是不合适的。

---

现在我们可以将创建单例的逻辑从原代码中抽离，封装进getSingel方法中。

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

现在我们实现一个简单创建div的小实例

这样我们无论点击多少次页面也只会有一个div。