JS设计模式之单例模式

单例模式（Singleton Pattern）是一种创建型设计模式，它确保一个类只有一个实例，并提供一个全局访问点来访问这个唯一实例。这种设计模式在多个地方需要访问同一份数据时非常有用，因为它可以确保所有地方访问的都是同一个实例，从而避免了因为多个实例而可能产生的数据不一致问题。

单例模式的主要优点包括：

1. 控制资源使用：通过限制类的实例化，可以节省系统资源，避免不必要的内存占用。
2. 提高系统性能：由于单例模式只创建一个实例，因此在需要频繁创建和销毁实例的情况下，可以显著提高系统性能。
3. 简化代码设计：单例模式提供了一种简洁的访问全局实例的方式，使得代码更加易于理解和维护。

单例模式在我们的开发过程中，特别是单页面应用的开发中，使用的就非常非常多了，举个例子：new Vue()就是单例模式，一个Vue类只有一个vue实例对象。接下来我们来看看，单例模式是怎么实现的呢？

ES5：

很多初学者，在对JS不熟悉的时候，使用函数，可能总是会忘记使用new关键字，直接就Singleton（），但是实际用法其实是new Singleton（）,这两者是有区别的，使用了new关键字就会创建出一个对象，而不使用，相当于函数的调用，考虑到后续项目代码量很大并且开发者各不相同的情况下，我们就可以使用单例模式做一个保险，无论是使用Singleton（），还是new Singleton（），都可以产生同样的效果。根据上述图片案例我们就可以看到，我定义了一个单例函数，let instance就是定义了一个实例，（function(){}）()这个代码代表函数立即执行的意思，大家可以看到，instance这个实例因为js的闭包，就会被缓存起来，不会被释放，当我去调用Singleton（）方法的时候，其实

                zs = function(name,age){
                    if(!insrance){
                        insrance = new Vue(name,age)
                    }
                    return insrance
                }

我们传入张三，和18，此时函数内部就会判断，instance实例是否存在，现在来看的话我们只定义了，但是没有赋值，那就是不存在。所以就会调用instance = new Vue（name,age），此时实例instance就变成了一个Vue实例对象。如果我们一开始使用的是new Singleton（张三，18），此时instance也会执行以上步骤，怕大家看不懂，看下图：

此时打开页面，浏览器会输出999，所以为什么new Singleton（张三，18）就是这个原因，因为在上面代码中new的时候其实Singleton（张三，18）这个函数也执行了，所以也能正常运行，接着如果我们在调用单例模式创建了一个实例后，再次调用，let ls = Singleton('李四',18)，其实得到的还是张三，18这个实例，大家可以阅读一下代码，我调用的时候进行判断了，instance已经存在了，所以会直接返回instance实例也就是张三，18，这样就可以保证后面无论你如何改变传的参数，永远也保证只有一个实例。这就是我们的单例模式的运用和使用方法了，接下来展示一下ES6的写法：

创建一个单例类，new的时候就会去调用构造函数去创建一个实例，当然了，因为是ES6的class写法，所以我们必须就要使用new关键字去调用了，不能省略new关键字，不然的话就会报错。当我们再次new 李四这个实例的时候，构造器触发的时候检测到instance已经存在了，就不会执行，直接返回张三，18这个实例，以上就是单例模式的用法。