八大最常用的JavaScript设计模式

设计模式（Design pattern） 是解决软件开发某些特定问题而提出的一些解决方案也可以理解成解决问题的一些思路。通过设计模式可以帮助我们增强代码的可重用性、可扩充性、 可维护性、灵活性好。我们使用设计模式最终的目的是实现代码的 高内聚 和 低耦合。通俗一点讲的话 打比方面试官经常会问你如何让代码有健壮性。其实把代码中的变与不变分离，确保变化的部分灵活、不变的部分稳定，这样的封装变化就是代码健壮性的关键。而设计模式的出现，就是帮我们写出这样的代码。 设计模式就是解决编程里某类问题的通用模板，总结出来的代码套路就是设计模式。本文章总结下JS在工作中常用的设计模式 ，以帮助大家提高代码性能，增强工作效率！

JavaScript设计模式（一）装饰器模式

先来理解一个概念 —— 构造器模式

你开了家动物园，只有两只动物，你可能会这样录入系统：

如果你的动物越来越多，对象字面量也会越来越多，这个时候构造函数可以自动创建动物对象

像 Animal 这样当新建对象的内存被分配后，用来初始化该对象的特殊函数，就叫做构造器。在 JavaScript 中，我们使用构造函数去初始化对象，就是应用了构造器模式。

可以看出每个实例化后 对象（ animal ）属性的key (name,age) 是不变的，对应的value（空空，泰格伍兹）是变的。所以构造器将赋值过程封装，确保了每个对象属性固定，开放了取值确保个性灵活。

简单工厂模式

动物园要求根据每个动物的食性喜好来分配不同的食物。这样之前封装的Animal 就不能直接用了，我们重新封装的构造器。

根据喜好可以分配相应的

总结

工厂模式：将创建对象的过程单独封装。

应用场景：有构造函数的地方、写了大量构造函数、调用了大量的 new的情况下

JavaScript设计模式（三）单例模式

总结

优点：适用于单一对象，只生成一个对象实例，避免频繁创建和销毁实例，减少内存占用。

缺点：不适用动态扩展对象，或需创建多个相似对象的场景。

JavaScript设计模式（四）-适配器模式

当电脑需要外接显示器的时候，我们都会用到下面这个东西。转换器帮助我们在不用更改笔记本接口的同时可以适配HDMI。

将转换器抽象到代码层面就是今天要介绍的适配器了。

适配器模式的作用是解决两个软件实体间的接口不兼容的问题。使用适配器模式之后，原本 由于接口不兼容而不能工作的两个软件实体可以一起工作。

适配器模式（结构型）

应用举例： 点外卖的时候有美团，饿了么可以选择，同一家店如果要对比两个平台的价格来回切换App十分不方便，作为一个Coder能用代码解决的坚决不用人力。这个时候我们就想到写个小应用对比两家的价格。

在他们openapi里找到了对应的方法，发现请求不一样，入参不一样，返回的数据结构也不一样。翻译成伪代码就是如下的状态

来源：千锋HTML5大前端