面试官:说说你对单例模式的理解?如何实现?

[人工智能] 时间:2025-11-05 02:12:35 来源:益强IT技术网 作者:应用开发 点击:195次

本文转载自微信公众号「JS每日一题」,面试模式作者灰灰。官说转载本文请联系JS每日一题公众号。说对实现

一、单例的理是解何什么

单例模式(Singleton Pattern):创建型模式,提供了一种创建对象的面试模式最佳方式,这种模式涉及到一个单一的官说类,该类负责创建自己的说对实现对象,同时确保只有单个对象被创建

在应用程序运行期间,单例的理单例模式只会在全局作用域下创建一次实例对象,解何让所有需要调用的面试模式地方都共享这一单例对象,如下图所示:

从定义上来看,官说全局变量好像就是说对实现单例模式,但是单例的理一般情况我们不认为全局变量是云服务器一个单例模式,原因是解何:

全局命名污染 不易维护,容易被重写覆盖

二、实现

在javascript中,实现一个单例模式可以用一个变量来标志当前的类已经创建过对象,如果下次获取当前类的实例时,直接返回之前创建的对象即可,如下:

// 定义一个类 function Singleton(name) {     this.name = name;     this.instance = null; } // 原型扩展类的一个方法getName() Singleton.prototype.getName = function() {     console.log(this.name) }; // 获取类的实例 Singleton.getInstance = function(name) {     if(!this.instance) {         this.instance = new Singleton(name);     }     return this.instance }; // 获取对象1 const a = Singleton.getInstance(a); // 获取对象2 const b = Singleton.getInstance(b); // 进行比较 console.log(a === b); 

使用闭包也能够实现,如下:

function Singleton(name) {     this.name = name; } // 原型扩展类的一个方法getName() Singleton.prototype.getName = function() {     console.log(this.name) }; // 获取类的实例 Singleton.getInstance = (function() {     var instance = null;     return function(name) {         if(!this.instance) {             this.instance = new Singleton(name);         }         return this.instance     }         })(); // 获取对象1 const a = Singleton.getInstance(a); // 获取对象2 const b = Singleton.getInstance(b); // 进行比较 console.log(a === b); 

也可以将上述的方法稍作修改,变成构造函数的形式,如下:

// 单例构造函数 function CreateSingleton (name) {     this.name = name;     this.getName(); }; // 获取实例的名字 CreateSingleton.prototype.getName = function() {     console.log(this.name) }; // 单例对象 const Singleton = (function(){     var instance;     return function (name) {         if(!instance) {             instance = new CreateSingleton(name);         }         return instance;     } })(); // 创建实例对象1 const a = new Singleton(a); // 创建实例对象2 const b = new Singleton(b); console.log(a===b); // true 

三、使用场景

在前端中,云服务器提供商很多情况都是用到单例模式,例如页面存在一个模态框的时候,只有用户点击的时候才会创建,而不是加载完成之后再创建弹窗和隐藏,并且保证弹窗全局只有一个

可以先创建一个通常的获取对象的方法,如下:

const getSingle = function( fn ){   let result;   return function(){     return result || ( result = fn .apply(this, arguments ) );   } };  

创建弹窗的代码如下:

const createLoginLayer = function(){   var div = document.createElement( div );   div.innerHTML = 我是浮窗;   div.style.display = none;   document.body.appendChild( div );   return div; };  const createSingleLoginLayer = getSingle( createLoginLayer );  document.getElementById( loginBtn ).onclick = function(){   var loginLayer = createSingleLoginLayer();   loginLayer.style.display = block; }; 

上述这种实现称为惰性单例,意图解决需要时才创建类实例对象

并且Vuex、redux全局态管理库也应用单例模式的思想,如下图:

现在很多第三方库都是单例模式,多次引用只会使用同一个对象,如jquery、lodash、moment...

参考文献

https://zh.wikipedia.org/zh-hans/%E5%8D%95%E4%BE%8B%E6%A8%A1%E5%BC%8F

https://www.runoob.com/design-pattern/singleton-pattern.html

https://juejin.cn/post/6844903874210299912#heading-5

亿华云计算

(责任编辑:域名)

    相关内容
    精彩推荐
    热门点击
    友情链接