JavaScript中的单例模式

定义：保证一个类仅有一个实例，并提供一个访问它的全局访问点。
单例模式对于一些全局唯一的对象很有用，避免创建多个对象造成资源浪费，例如：线程池、全局缓存、浏览器中的window对象等。在JavaScript中实现单例模式可以有多种写法，下面以创建一个全局弹窗为例：

const Singleton = function (name) {
    this.name = name
    this.instance = null
}
Singleton.prototype.getName = function () {
    return this.name
}
Singleton.getInstance = function (name) {
    return this.instance || (this.instance = new Singleton(name))
}

const a = Singleton.getInstance('sven1')
const b = Singleton.getInstance('sven2')

console.log(a === b)

这样写可以实现单例，但是却无法像平时一样使用new操作声明对象，再改造下：

const Singleton = (function () {
    var instance
    const createSingleton = function (name) {
        if (instance) {
            return instance
        }
        this.name = name
        return instance = this
    }
    createSingleton.prototype.getName = function () {
        return this.name
    }
    return createSingleton
})()

const a = new Singleton('sven1')
const b = new Singleton('sven2')

console.log(a === b)
a.getName() // sven1
b.getName() // sven1

很明显，这里通过闭包来达到全局唯一的目的，全局实例存放在一个自执行函数的一个变量中。看着还行，Singleton构造函数主要做了两件事，首先创建并初始化一个对象，然后保证只有一个对象。但是很明显，这个类只能用于创建单例，假设后面我们需要创建多个实例的时候，就不ok了，所以可以继续改造，然后每个函数保持单一职责：

const CreateObj = function (name) {
    this.name = name
}
CreateObj.prototype.getName = function () {
    return this.name
}

const CreateSingletonProxy = (function () {
    var instance

    return function (name) {
        return instance || (instance = new CreateObj(name))
    }
})()

这样分离开来，CreateSingletonProxy函数负责保证只有一个对象，CreateObj函数用于创建和初始化对象，我们既可以用CreateObj创建多个对象，也可以使用CreateSingletonProxy创建单例对象~~~

仔细观察上面代码，发现CreateSingletonProxy和CreateObj是耦合在一起，如果想要给其他构造函数也使用单例模式，又会重新复制一份代码，不如将CreateSingletonProxy抽象为一个通用的单例吧：

const CreateSingletonProxy = function (fn) {
    var instance

    return function (...args) {
        return instance || (instance = new fn(...args))
    }
}

function A(arg) {
    this.a = arg
}
function B(c, d) {
    this.b = c + d
}
// 不管有多少个构造函数，都可以建立自己的单例
const SingleA = CreateSingletonProxy(A)
new SingleA(1) // { a: 1 }
new SingleA(2) // { a: 1 }
const SingleB = CreateSingletonProxy(B)
new SingleB(1, 2) // { b: 3 }
new SingleB(3, 4) // { b: 3 }

更有趣的一点是，上面的代码，都是使用单例模式去创建一个对象，但其实在平时js工作中，单例模式的使用远不止创建对象这一点，我们甚至可以去控制某些行为的单次执行，比如说对于一个使用ajax动态渲染的列表，我们只需要在第一次渲染的时候给列表根元素绑定事件代理，平时开发中，最爱做的就是设一个阀门值，判断是否已经绑定过了：

let hasBindEvent = false
const bindEvent = function () {
    console.log('给根元素绑定事件代理')
    hasBindEvent = true
}
const render = function () {
    console.log('渲染列表')
    if (!hasBindEvent) {
        bindEvent()
    }
}
render()
render() // 第二次渲染

如果使用单例模式：

const getSingle = function (fn) {
    let instance
    return function (...args) {
        return instance || (instance = fn.apply(fn, args))
    }
}
const bindEvent = getSingle(function () {
    console.log('给根元素绑定事件代理')
    return true
})
const render = function () {
    console.log('渲染列表')
    bindEvent()
}
render()
render() // 第二次渲染

类似这种例子，我平时还是遇见很多的，但就是想不起来了~~就先借用书中的?