JS实现单例设计模式（面试最常考的设计模式之一Σ(⊙▽⊙“a）

最新推荐文章于 2024-08-26 14:58:12 发布

Code_Dreaming

最新推荐文章于 2024-08-26 14:58:12 发布

阅读量460

点赞数 2

文章标签：面试 javascript 设计模式

本文链接：https://blog.csdn.net/weixin_45704555/article/details/120029145

版权

本文详细介绍了JavaScript中实现单例设计模式的两种常见思路：静态方法和闭包。单例模式确保类只有一个实例，并提供全局访问点。静态方法通过类的静态方法避免实例化过程，闭包则利用函数内部的变量保存实例。文章还提到了单例模式在网页弹窗等场景中的经典应用，强调其在性能优化方面的作用。

摘要由CSDN通过智能技术生成

单例模式
思路1 静态方法
思路2 闭包
单例模式的经典应用
小结
参考

单例模式

单例模式简单来说就是使类只能实例化一次，并提供一个能够访问它的全局接口。
js中由两种实现思路，一种是将访问接口实现为静态方法，创建对象只执行一次；还有一种是利用闭包，通过闭包的方式给全局暴露一个实例化对象，内部只能实例化一次

思路1 静态方法

具体阐述

它是未来大型应用的开发需要
new Singleton() 类实例化的简单用法不合适了，
Singleton.getInstance() 静态方法
那么怎么绕过new？绕过实例化的过程，使用类上的静态方法就可以了
以后要获取单例，通过Singleton.getInstance() 拿
把实例挂载在要实例化类的 this.instanceof 上，
第一次调用getInstance时去实例化立即设置赋值this.instance，
之后再访问就直接返回this.instance

概念辨析

在使用静态方法之前，先了解它与原型对象的方法的区别：

原型对象上的方法：

function Singleton(name) {
    // 构造方法
	this.name = name;
}
Singleton.prototype.say = function() {
   
	console.log('------say something-----');
}
let tom = new Singleton('tom');
tom.say(); // 实例上的方法 __proto__

静态方法：

function Singleton(name) {
    // 构造方法
	this.name = name;
}
Singleton.getInstance = function(name) {
   
	console.log('-----获取实例-----',name);
}
let tom = Singleton.getInstance('tom');

【注】与java一样，静态方法是直接由类来调用的，而原型对象上定义的方法则是由类的实例来调用的

了解之后，开始正式实现

正式实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>