单例模式

0、定义

TIP

1、系统中被唯一使用

2、一个类只有一个实例

1、设计原则验证

• 1、符合单一职责原则，只实例化唯一的对象
• 2、没法具体开放封闭原则，但是绝对不违反开放封闭原则

2、示例

示例：登陆框、购物车

3、代码

class SingleObject {
    login() {
        console.log('login...')
    }
}

SingleObject.getInstance = (function(){
    let instance
    return function() {
        if (!instance) {
            instance = new SingleObject()
        }
        return instance
    }
})()

let obj1 = SingleObject.getInstance()
obj1.login()
let obj2 = SingleObject.getInstance()
obj2.login()

console.log('obj1 === obj2', obj1 === obj2)

console.log('-----使用不规范分割线-----')
// JS无法实现构造函数私有化
let obj3 = new SingleObject()
obj3.login()
console.log('obj1 === obj3', obj1 === obj3)

4、经典场景

4.1、jQuery 只有一个 $

// jQuery 只有一个 $
if (window.jQuery != null) {
    return window.jQuery
} else {
    // 初始化...
}

4.2、模拟登录框

class LoginForm {
    constructor() {
        this.state = 'hide'
    }
    show() {
        if (this.state === 'show') {
            alert('已经显示')
            return
        }
        this.state = 'show'
        console.log('登陆框显示成功')
    }
    hide() {
        if (this.state === 'hide') {
            alert('已经隐藏')
            return
        }
        this.state = 'hide'
        console.log('登陆框隐藏成功')
    }
}

LoginForm.getInstance = (function(){
    let instance
    return function() {
        if (!instance) {
            instance = new LoginForm()
        }
        return instance
    }
})()

let login1 = LoginForm.getInstance()
login1.show()
let login2 = LoginForm.getInstance()
login2.hide()

console.log('login1 === login2', login1 === login2)

4.3、其他场景

购物车(和登陆框类似) vuex和redux的store