JavaScript设计模式之单例模式

lk20150415 发布于2019-08-23 13:46 / 3034人阅读

摘要：原文博客地址单例模式系统中被唯一使用，一个类只有一个实例。中的单例模式利用闭包实现了私有变量两者是否相等弱类型，没有私有方法，使用者还是可以直接一个，也会有方法分割线不是单例最简单的单例模式，就是对象。

原文博客地址：https://finget.github.io/2018/11/06/single/

单例模式

系统中被唯一使用，一个类只有一个实例。实现方法一般是先判断实例是否存在，如果存在就返回，不存在就创建再返回。
在JavaScript里，单例作为空间提供者，从全局命名空间里提供一个唯一的访问点来访问该对象。

模式作用：

模块间通信

系统中某个类的对象只能存在一个

保护自己的属性和方法

注意事项：

注意this的使用

闭包容易造成内存泄漏，不需要的赶快干掉

注意new的成本

代码示例

java中的单例模式

java请类型可以私有化，外部new就会报错。

JavaScript中的单例模式

class SingleObject {
  login() {
    console.log("login")
  }
}
// 利用闭包实现了私有变量
SingleObject.getInstance = (fucntion () {
  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弱类型，没有私有方法，使用者还是可以直接new 一个 SingleObject，也会有 login方法
console.log("------------分割线------------")
let obj3 = new SingleObject()
obj3.login()
console.log("obj1===obj3",obj1 === obj3) // false 不是单例

最简单的单例模式，就是对象。在 JavaScript 中 定义一个对象(Object)，那么它的属性，就只能通过它自己调用。就算两个不同的对象，有相同的属性名，也不能相互调用，保护了自己属性。

登录框单例

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()
// login1.hide()

// 另一个页面中调用登录框
let login2 = LoginForm.getInstance()
login2.show()

// 两者是否相等
console.log("login1 === login2", login1 === login2)

最后

创建了一个前端学习交流群，感兴趣的朋友，一起来嗨呀！

云服务器 GPU云服务器单例模式单例模式实现单例模式总结 pdo单例模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/99539.html

javascript设计模式学习笔记之单例模式

摘要：单例模式单例模式就是保证一个类仅有一个实例并提供一个访问它的全局访问点其最大的特点就是永远只返回一个实例实例通过来获取类的唯一对象其缺点也明显增加了类的不透明性透明的单例模式最终会被返回使用代理实现单例模式将负责管理单例的逻辑移到了代理类中单例模式单例模式就是保证一个类仅有一个实例, 并提供一个访问它的全局访问点. 其最大的特点就是永远只返回一个实例 var Sin...

xiaolinbang 2019-08-23 15:54 评论0 收藏0
javascript设计模式与开发实践全书深度解析（一）之单例模式

摘要：所以程序在引入文件的时候用了单例模式，一个文件实例化一次，这种做法无疑是好的，但是也容易引起。在我们平时的开发过程中，可以借鉴这两种方式去缓存变量，节点等。这一章作者讲了一个例子，就是在用单例模式生成一个dom节点，还要做到只有访问的时候才创建，后续访问直接用前面创建的。那么实际开发中我们会用到这个模式吗？现在我们基本都是用vue，react，angular开发，不太会直接去操作do...

xioqua 2019-08-26 13:43 评论0 收藏0
每天一个设计模式之单例模式

摘要：博主按每天一个设计模式旨在初步领会设计模式的精髓，目前采用靠这吃饭和纯粹喜欢两种语言实现。单例模式用途如果一个类负责连接数据库的线程池日志记录逻辑等等，此时需要单例模式来保证对象不被重复创建，以达到降低开销的目的。博主按：《每天一个设计模式》旨在初步领会设计模式的精髓，目前采用javascript（_靠这吃饭_）和python（_纯粹喜欢_）两种语言实现。诚然，每种设计模式都有多种实...

yy736044583 2019-07-31 11:16 评论0 收藏0
每天一个设计模式之单例模式

摘要：博主按每天一个设计模式旨在初步领会设计模式的精髓，目前采用靠这吃饭和纯粹喜欢两种语言实现。单例模式用途如果一个类负责连接数据库的线程池日志记录逻辑等等，此时需要单例模式来保证对象不被重复创建，以达到降低开销的目的。博主按：《每天一个设计模式》旨在初步领会设计模式的精髓，目前采用javascript（_靠这吃饭_）和python（_纯粹喜欢_）两种语言实现。诚然，每种设计模式都有多种实...

lijy91 2019-08-23 12:39 评论0 收藏0
JavaScript设计模式与开发实践系列之单例模式

摘要：本系列为设计模式与开发实践作者曾探学习总结，如想深入了解，请支持作者原版单例模式实现单例模式单例模式的定义是保证一个类仅有一个实例，并提供一个访问它的全局访问点。本系列为《JavaScript设计模式与开发实践》（作者：曾探）学习总结，如想深入了解，请支持作者原版单例模式实现单例模式单例模式的定义是：保证一个类仅有一个实例，并提供一个访问它的全局访问点。单例模式是一种常用的模式...

Airy 2019-08-19 17:47 评论0 收藏0