单例模式
避免多次初始化,影响性能
介绍
- 系统中被唯一使用
- 一个类只有一个实例
示例
-
登录框
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('-------- 分割线 --------') let obj3 = new SingleObject() obj3.login() console.log('obj3 === obj1 ?', obj3 === obj1)
结果
-
购物车
UML类图
经典使用场景
-
jQuery只有一个$
有就直接用,没有就实例化一个 -
vuex和redux中的store
模块A、模块B等获取的store内容都是一样的
具体见未来某天的源码分析 -
购物车、模拟登录框
// 模拟登录框
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()
结果
设计原则验证
- 符合单一职责原则,只实例化唯一的对象
- 没法具体开放封闭原则,但是绝对不违反开放封闭原则