当前位置：首页 > news >正文

JS设计模式（一）单例模式

news 2025/7/5 18:32:34

注释很详细，直接上代码

本文建立在已有JS面向对象基础的前提下，若无，请移步以下博客先行了解

JS面向对象（一）类与对象写法

特点和用途：

全局访问点：通过单例模式可以在整个应用程序中访问同一个对象实例，而不要每次使用时都创建新的对象。
节省资源：特别是在需要频繁创建和销毁对象时，单例模式可以减少内存和资源占用。
数据共享：由于单例模式只有一个实例，可以确保数据在各个部分共享使用。

单例模式在开发中广泛应用，例如管理全局状态、配置信息、日志记录器等场景，确保整个应用程序中某个类只有一个实例是非常有用的

源码：

index.html

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title></head><body></body><script>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 obj1 = LoginForm.getInstance();obj1.show();let obj2 = LoginForm.getInstance();//两次获取的实例是同一个obj2.hide();console.log(obj1 === obj2);//这里演示一下闭包的应用//--------------------------------------------------/*function myTest() {let sum = 0;return function add(num) {sum += num;console.log(sum);};}let add = myTest();add(1);add(2);let add2 = myTest();add2(5);add2(6);*/</script>
</html>