什么是单例模式？
- 系统中被唯一使用
- 一个类只有一个实例
上面是单例模式的一个特点，看起来比较抽象，我们可以结合日常开发中的实例来理解，比如：
- 登录框
- 购物车
不难理解，一个大型的项目或者商城系统，不管系统多大，都只能有一个登录框，一个购物车，如果不使用单例模式，让其有多个登录框和购物车，那么将导致系统的bug。
单例模式的UML类图和代码
同样的，在学习或者研究一种设计模式的时候，我们首先要画出其UML类图，网上的关于单例模式的UML类图也是有很多，但大多数也是基于Java的，相对于java,JS作为弱类型语言，有一些概念是没有的或者没法实现的。
可以看到哈，上面的UML类图中，强依赖于“-”也就是‘private’,而JS中是没有这样的关键字的，这里我们要是强理解Java代码可能会比较费劲，但是我们可以通过JS的闭包来模拟出这一操作。
class SingleObject {
login() {
console.log('login...')
}
}
// 为SingleObject赋一个静态的方法，这样在实例化的时候，不能让所有实例都访问到。模拟一个“private”私有属性
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)
如果我们的代码是单例模式的，那么每次执行出来的结果，得到的实例应该是一模一样的，在JS中应该使用“===”来验证，反之，则不行。上面代码的运行结果为
可见，我们通过JS，模拟除了UML类图中的单例模式。因为JS语言的弱类型，我们无法像java一样去私有化一个构造函数，所以，这里如果你使用
new SingleObject来做实例化，也是可以，只不过就不是单例模式了，我么你这里的代码，只是通过JS来做一个模拟，让大家知道单例模式是什么，在前端开发中的应用场景有哪些即可。太细节的东西，大家就不要纠结了。
单例模式在前端开发中的应用场景
- jQuery只有一个$
我们知道，不管你在网页中引入多少遍Jquery，最终都只有一个$,这就是一个单例模式，同样，我们在日常的开发或者学习中，也可以去使用单例模式，来避免一些重复的操作。
- 登录框
- 系统中的购物车
- vuex和redux中的store
设计原则验证
- 符合单一职责原则，只实例化唯一的对象
- 没法具体开放封闭原则，但是也不违反开放封闭原则
写在后面
受限于JS的语言特点，我们无法完全准确的写出单例模式，只能做一个简单的模拟，实际开发中，我们记住这种模式即可
（本节完...）
网友评论