javascript实现单例模式

什么是单例模式

单: 单一, 一个

例: 实例

所谓的单例, 就是指一个类只有一个实例, 不管你 new 多少次, 都是这一个实例

具体的实现思路就是:

先判断实例是否存在
如果存在则直接将实例返回
如果不存在, 就创建了再返回

先看一个普通的实例化

function Person() {this.name = '猫'
}const p1 = new Person()
const p2 = new Person()console.log(p1, p2);
console.log(p1 == p2);

单例模式就是帮助我们把这里的 false变成 true

回过头看上面的思路, 有两个重要的点:

怎么判断实例是否存在 ?
将实例返回意味着什么 ?

对于上面两个问题:

我们是不是可以提前设置一个用于实例化的变量, 但是不赋值
注意第二个问题中的返回, 两个字, 意味着我们需要在函数内部完成

单例的简单实现

function Person() {this.name = '猫'
}// 单例模式的核心代码
// 标识flag
var instance
// 单例模式的核心代码
function singleTon() {if (!instance) instance = new Person()return instance
}const p1 = singleTon()
const p2 = singleTon()console.log(p1, p2);
console.log(p1 == p2);

原理是什么:

第一次执行 singleTon, 因为标识 instance 是undefined, 取反以后就是 true, 此时就会创建Person的一个实例, 然后将其返回, 当我们第二次调用 singleTon, 因为 instance 是全局变量, 会被一直保存, 所以此时instance 的值为刚刚的实例对象, 此时再取反就是false, 会将instance 直接返回除去, 也就实现的只有一个实例

因为全局变量带来的某些负面影响,我们应当尽可能少的使用全局变量, 如果我们将 instance 声明成局部变量, 函数执行完后局部变量又会被释放, 怎么办 ?

这时候闭包站出来了, 闭包说: 我可以帮助你们保存函数的上下文环境, 让局部变量一直存在

既然如此, 那咱们就写写看呗

var singleTon = (function () {// 将类移到自执行函数内部, 是为了不对外暴露内部实现function Person() {this.name = '猫'}let instancereturn function () {if (!instance) instance = new Person()return instance}
})()const p1 = singleTon()
const p2 = singleTon()console.log(p1, p2);
console.log(p1 === p2);

2. 单例模式有什么作用

单例模式主要的用途就是网页弹出框的开发

比如说, 我们需要开发一个登录框和一个注册框, 两者的整体布局大致相同, 有如下思路

分别开发两个弹出框
开发一个弹出框, 实例化出登录框和注册框, 各自的细节各自再实现

javascript实现单例模式相关推荐

JavaScript设计模式----单例模式
声明:这个系列为阅读<JavaScript设计模式与开发实践> --曾探@著一书的读书笔记 1.单例模式的特点和定义保证一个类仅有一个实例,并且提供一个访问它的全局访问点. 2.传统面向 ...
javascript设计模式--单例模式
什么是单例模式单例就是保证一个类只有一个实例,实现的方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象.在JavaScript里,单例作为一个 ...
JavaScript设计模式——单例模式的理解与应用
JavaScript设计模式--对单例模式的一些见解 JavaScript设计模式主要分类: ①创建型设计模式,例如单例模式.工厂模式 ②结构型设计模式,例如装饰者模式.适配器模式 ③行为型设计模式, ...
JavaScript设计模式单例模式
单例模式的定义是:保证一个类仅有一个实例,并提供一个访问它的全局访问点. 先看一下,在Js中使用传统面向对象的单例模式. 面向对象的单例模式,是通过new关键字来实例化我们想要的对象,并将其赋值给in ...
javascript设计模式-单例模式（singleton pattern）
为什么80%的码农都做不了架构师?>>> 最简单的单例模式 var mySingleton = {property1: "something",proper ...
JavaScript设计模式——单例模式
单例模式单例模式顾名思义就是只生成一个实例对象的一种模式.无论调用多少次都只返回相同的实例. 当我们单击登录按钮的时候,页面中会出现一个登录浮窗,而这个登录浮窗是唯一的,无论单击多少次登录按钮,这个 ...
Javascript设计模式
设计原则(SOLID) 单一职责模式(S) 一个程序只做好一件事如果功能过于复杂就拆分开,每个部分保持独立里式替换原则(L) 子类能覆盖父类父类能出现的地方子类就能出现 JS中使用较少(弱类型& ...
Javascript学习之函数(function)
http://www.cnblogs.com/royalroads/p/4418587.html 在JS中,Function(函数)类型实际上是对象;每个函数都是Function类型的实例,而且都与其 ...
《JavaScript设计模式》读后感觉很复杂
接触前端两三个月的时候,那时候只是听说设计模式很重要,然后我就去读了一本设计模式的书,读了一部分,也不知道这些设计模式到底设计出来干嘛的,然后就没再看了.后来就自己做一些小项目也觉着好像不需要用到设计 ...
《JavaScript设计模式》读后感
接触前端两三个月的时候,那时候只是听说设计模式很重要,然后我就去读了一本设计模式的书,读了一部分,也不知道这些设计模式到底设计出来干嘛的,然后就没再看了.后来就自己做一些小项目也觉着好像不需要用到设计 ...

javascript实现单例模式

什么是单例模式

2. 单例模式有什么作用

javascript实现单例模式相关推荐

最新文章

热门文章