这是我参与「第四届青训营 」笔记创作活动的第4天
设计模式概览
设计模式是对软件设计开发过程中反复出现的某类问题的通用解决方案。设计模式更多的是指导思想和方法论，而不是现成的代码，当然每种设计模式都有每种语言中的具体实现方式。学习设计模式更多的是理解各种模式的内在思想和解决的问题，毕竟这是前人无数经验总结成的最佳实践，而代码实现则是对加深理解的辅助。
设计模式可以分为三大类：
- 结构型模式(Structural Patterns): 通过识别系统中组件间的简单关系来简化系统的设计。
- 创建型模式(Creational Patterns): 处理对象的创建，根据实际情况使用合适的方式创建对象。常规的对象创建方式可能会导致设计上的问题，或增加设计的复杂度。创建型模式通过以某种方式控制对象的创建来解决问题。
- 行为型模式(Behavioral Patterns):用于识别对象之间常见的交互模式并加以实现，如此，增加了这些交互的灵活性。
上述中一共有23种设计模式，前端方向的，需要了解的大概有以下10种。
前端需要了解的设计模式(10种)
创建型模式
故名思意，这些模式都是用来创建实例对象的。
1. 工厂模式
我们从简单的开始。 简单工厂模式是由一个工厂对象决定创建出哪一种产品类的实例。
2. 单例模式
首先我们需要理解什么是单例？
单：指的是一个。
例：指的是创建的实例。
单例：指的是创建的总是同一个实例。也就是使用类创建的实例始终是相同的。
3. 原型模式
通俗点讲就是创建一个共享的原型，并通过拷贝这些原型创建新的对象。
在我看来，其实原型模式就是指定新创建对象的模型,更通俗一点来说就是我想要新创建的对象的原型是我指定的对象。
最简单的原型模式的实现就是通过Object.create()。Object.create()，会使用现有的对象来提供新创建的对象的__proto__。
结构型模式
1. 装饰器模式
装饰器模式：为对象添加新功能，不改变其原有的结构和功能。
适配器模式是原有的不能用了，要重新封装接口。装饰器模式是原有的还能用，但是需要新增一些东西来完善这个功能。
比如手机壳，手机本身的功能不受影响，手机壳就是手机的装饰器模式。
2. 适配器模式
适配器模式：旧接口格式和使用者不兼容，中间加一个适配转换接口。
比如国外的插座跟国内的插座不一样，我们需要买个转换器去兼容。
3. 代理模式
代理模式：使用者无权访问目标对象，中间加代理，通过代理做授权和控制。
明星经纪人：比如有个演出，要请明星，要先联系经纪人。
行为型模式
1. 策略模式
策略模式是一种简单却常用的设计模式，它的应用场景非常广泛。我们先了解下策略模式的概念，再通过代码示例来更清晰的认识它。
策略模式由两部分构成：一部分是封装不同策略的策略组，另一部分是 Context。通过组合和委托来让 Context 拥有执行策略的能力，从而实现可复用、可扩展和可维护，并且避免大量复制粘贴的工作。
2. 观察者模式
观察者模式又叫发布订阅模式（Publish/Subscribe），它定义了一种一或一对多的关系，让多个观察者对象同时监听某一个主题对象，这个主题对象的状态发生变化时就会通知所有的观察者对象，使得它们能够自动更新自己。典型代表vue/react等。
使用观察者模式的好处：
支持简单的广播通信，自动通知所有已经订阅过的对象。 目标对象与观察者存在的是动态关联，增加了灵活性。 目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。
3. 迭代器模式
ES6中的迭代器 Iterator 相信大家都不陌生，迭代器用于遍历容器（集合）并访问容器中的元素，而且无论容器的数据结构是什么（Array、Set、Map等），迭代器的接口都应该是一样的，都需要遵循 迭代器协议。
迭代器模式解决了以下问题：
提供一致的遍历各种数据结构的方式，而不用了解数据的内部结构 提供遍历容器（集合）的能力而无需改变容器的接口
4. 状态模式
状态模式：一个对象有状态变化，每次状态变化都会触发一个逻辑，不能总是用if...else来控制。
最后
以上就是我在此次青训营课程 《前端设计模式应用》 中的一些思考和总结。
