单例模式

[TieMuZhen]

什么是单例

想要保证一个类仅有一个实例，我们需要提供一个变量来标志当前是否已经为一个类创建过实例。所以，单例模式的核心就是：确保只有一个实例，并提供全局访问。

通用惰性单例

// 将函数作为一个参数传递
var Singleton = function(fn) {
    var instance
    return function() {
        // 通过apply的方式收集参数并执行传入的参数将结果返回
        return instance || (instance = fn.apply(this, arguments))
    }
}

这种方式最大的优点就是相当于缓存了我们想要的结果，并且在我们需要的时候才去调用它，符合封装的单一职责

应用

一个全局的遮罩层我们不可能每一次调用的时候都去创建它，最好的方式就是让它只创建一次，之后用一个变量将它保存起来，再次调用的时候直接返回结果即可

单例模式就很符合我们这样的需求

// 模拟一个遮罩层
var createDiv = function () {
    var div = document.createElement('div')
    div.style.width = '100vw'
    div.style.height = '100vh'
    div.style.backgroundColor = 'red'
    document.body.appendChild(div)
    return div
}

// 创建出这个元素
var createSingleLayer = Singleton(createDiv)

document.getElementById('btn').onclick = function () {
    // 只有在调用的时候才展示
    var divLayer = createSingleLayer()
}

当然，在实际应用中还是有很多适用场景的，比如登录框。