什么是单例模式?
定义:保证一个类只有一个实例,且提供一个可以访问它的全局访问点。
减少多次实例化造成的不必要资源和内存的消耗。
function init (name) {
this.name = name
this.getName = function() {
return this.name
}
}
const Singleton = function () {
this.instance = null
}
Singleton.getInstance = function(name){
if (!this.instance) {
this.instance = new init(name)
}
return this.instance
}
const instanceA = Singleton.getInstance('Cindy')
const instanceB = Singleton.getInstance('Anna')
console.log(instanceA.getName()) // Cindy
console.log(instanceA === instanceB) // true
什么场景下使用单例模式
预期对象只有一个,且能够获取到对象信息的时候,例如全局缓存、浏览器中的window。
适用实例场景:
- 淘宝网点击“登录”按钮,会弹出登录弹窗。无论点击多少次这个按钮,这个弹窗实际上只需要创建一次就够。
- 用户编辑表单信息,在保存的如果检验不通过会提示不同的error信息,显然每次都重新创建一个弹窗的 DOM 是没有必要的,这里就可以使用单例模式
在 JavaScript 中怎么实现单例模式
目前可以通过全局变量的方式来实现,全局变量的方式创建的对象是唯一的,并且在代码任意位置都能被访问到。但是全局变量也存在十分明显的缺点:
- 全局污染
- 变量容易被覆盖
一般情况下要尽量减少对全局变量的使用,如果一定要使用要尽量将污染降低到最小,方式有以下几种:- 使用命名空间
适当地使用命名空间,不能杜绝全局变量,只是减少全局变量的数量
- 使用命名空间
var nameSpace = {
name: 'a',
getName: function() {
return 'Name is:' + this.name
}
}
- 使用闭包封装私有变量
把一些变量保存在闭包内部,暴露一些对外的方法跟外界通信,这种方式可以完全规避对全局污染
(function() {
const __name = ''
const __age = 10
return {
getName() {
return 'Name is:' + __name
}
}
})()
什么是惰性单例模式
在需要的时候才实例化,这是单例模式的重点,在日常开发中十分实用,将上面的示例改造一下
function init (name) {
this.name = name
this.getName = function() {
return this.name
}
}
const Singleton = (function () {
let instance
return function(name) {
if(!instance) {
instance = new init(name)
}
return instance
}
})()
const instanceA = new Singleton('Cindy')
const instanceB = new Singleton('Anna')
console.log(instanceA.getName()) // Cindy
console.log(instanceA === instanceB) // true