从今天开始，我会继续更新javascript的设计模式。主要信息来源是https://www.patterns.dev/，它涵盖了所有设计模式。主要内容来自本站的翻译加上自己的理解。前沿的设计模式是软件开发的一个基础部分，因为在大型的软件设计过程中，经常会出现一些设计模式，可以用来优化我们的一些代码逻辑和处理方式。整个开发系统发生了快速变化。尽管一些设计模式可能不再具有相应的价值，但其中一些已经被开发出来以解决一些现代问题。React相信大家都不陌生，最近一段时间收获颇丰。注意，哦不，react一直很受关注，从npm包的下载量可以明显看出react一直在几大框架的榜单中名列前茅。由于react的流行，对传统的设计模式进行了修改和优化，创造了一种新的设计模式，在现代web开发中提供相应的价值，比如react的hook特性，可以替代很多传统的设计模式，所以这个题目，希望通过一起学习，设计模式的实现，好处，陷阱，面试都赢了单例模式单例代表一个可以实例化一次，可以全局访问的类。这个单例可以在我们的应用中共享，所以单例模式非常适合管理应用中的全局状态。我们来看看什么是单例。我们可以建立一个Counter类，它有以下方法returninstance(getInstance)returnthecurrentvalueofthecounter(getCount)计数值加一（递增）计数值减一（递减）letcounter=0classCounter{getInstance(){returnthis}getCount(){returncounter}increment(){return++counter}decrement(){return--counter}}虽然实现了上面的功能，但是这个类其实并不符合标准。标准规定这个类只能实例化一次，但是上面的代码我们可以创建很多Counter实例constcounter1=newCounter()constcounter2=newCounter()console.log(counter1.getInstance()==counter2.getInstance())//false两次实例化后，获取的实例不相等。这两个实例只是对不同实例的引用。Onlyoneinstance确保我们只能创建一个实例最好的方法是创建一个名为instance的变量。在构造函数中，我们可以在创建实例时将实例设置为对实例的引用，然后检查instantce变量是否已经有值，以防止重复实例化。如果它已经被实例化，则抛出一个错误让用户知道一个实例已经存在letcounter=0letinstance=nullclassCounter{constructor(){if(instance){thrownewError("TherecanonlybeoneinstanceCounter")}}getInstance(){returnthis}getCount(){returncounter}increment(){return++counter}decrement(){return--counter}}constcounter1=newCounter();constcounter2=复制代码newCounter();//错误：你只能创建一个实例！这样就无法创建多个实例。Object.freeze这时候我们需要导出我们的实例，但是在导出之前，我们应该使用Object.freeze方法来保证初始化的实例不会被修改，减少使用constsingletonCounter=Object.freeze(new柜台（））;导出默认单例计数器；这样，我们就导出了singletonCounter，我们可以在任意JavaScript文件中使用singletonCounter，在不同的文件中调用，数据共享，可以更改counter的值，并且能够读取最新的值优缺点限制实例化为一个实例节省了大量的内存空间，而不是每次都给一个新的实例分配内存，这个实例可以在整个应用程序中被引用，但是单例模式被认为是一种反模式，在其他编程的JavaScript中应该避免语言，如java或c++，不可能遵循javas像脚本一样直接创建对象。在面向对象的编程语言中，您需要创建一个类。这个类将创建一个对象。创建的对象具有类实例的值，就像javascript中的实例值一样。其实上面的系列操作，可以用一个简单的正则对象来代替，比如letcount=0;constcounter={increment(){return++count;},decrement(){return--count;}};Object.freeze(counter);export{counter};这样可以达到Counter类的等价效果，同时也存在一定的风险隐患。比如我们在一个单例中引入另一个单例。这里我们创建了一个superCounter的实例，其中引入了CounterInstances，在其他文件中引入Counter实例可能会带来风险。一旦superCounter被调用，Counter也会发生变化。从“./counter”导入计数器；导出默认类SuperCounter{constructor(){this.count=0;}increment(){Counter.increment();返回（this.count+=100）；}递减（）{Counter.decrement（）;返回（this.count-=100）；}}总结一个Instances应该可以在整个应用程序中被引用，并且具有全局行为也被认为是一个糟糕的设计，因为你可以随意改变它，但你并不知道具体在哪里改变它在react中，经常通过redux或reactcontext等状态管理工具进行全局状态管理，而不是使用单例模式，尽管它们看起来非常像单例模式，但这些工具提供只读状态而不是单例可变状态，当使用redux时，只有reducers纯函数可以通过调度器发送动作来更新组合中的状态。这些工具也有全局状态的缺点，但是它们可以让全局状态按照我们制定的规则或者顺序发生变化
