前端常用设计模式
前端常用设计模式
GoF23
- 一种思维，一种态度，一种进步
创建型模式：
- 单例模式、工厂模式、抽象工厂模式、建造者模式、原型模式。
结构型模式：
- 适配器模式，桥接模式，装饰模式，组合模式，外观模式，享元模式，代理模式。
行为型模式：
- 模板方法模式，命令模式，迭代器模式，观察者模式，中介者模式，备忘录模式，解释器模式，状态模式，策略模式，职责链模式，访问者模式。
OOP七大原则
前端常用五种设计模式有哪些？
- 工厂模式
- 单例模式
- 代理模式
- 观察者模式
- 策略模式
工厂模式
抽象工厂模式
单例模式
核心作用：
- 保证一个类只有一个实例，并且提供一个访问该实例的全局访问点
常见场景：
- Windows的任务管理器
- Windows的回收站
- 项目中，读取配置文件的类，一般也只有一个对象，没必要每次都去new对象读取
- 网站的计数器一般也会采用单例模式，可以保证同步
- 数据库连接池的设计一般也是单例模式
- 在Servlet编程中，每个Servlet也是单例的
- 在Spring中，每个Bean默认就是单例的
代理模式
代理模式主要为其他对象提供一种代理以控制对这个对象的访问，主要解决在直接访问对象时带来的问题。
代理模式最基本的形式是对访问进行控制，代理对象和另一个对象(本体)实现的是同样的接口。
实际上工作还是本体在做，它才是负责执行所分派的任务的那个对象或类，代理对象所做的不外乎节制对本体的访问，代理对象并不会在另一对象的基础上添加方法或修改其方法，也不会简化那个对象的接口，它实现的接口与本体完全相同，所有对它进行的方法调用都会被传递给本体。
总结：在上面的代码中，Proxy可以控制对真正被代理对象的一个访问。在代理模式中，比较常见的就是虚拟代理，虚拟代理用于控制对那种创建开销很大的本体的访问，它会把本体的实例化推迟到有方法被调用的时候。
比如说，现在我们假设PublicLibrary的实例化很慢，不能在网页加载的时候立即完成，我们可以为其创建一个虚拟代理，让它把PublicLibrary的实例化推迟到必要的时候，比如说我们在前端中经常用到的图片懒加载，就可以用虚拟代理;
观察者模式
如果大家学过一些像vue，react这些框架，相信大家对观察者模式一定很熟悉，现在很多mvvm框架都用到了观察者模式这个思想，观察者模式又叫做发布—订阅模式。
它定义对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知和更新，观察者模式提供了一个订阅模型，其中对象订阅事件并在发生时得到通知，这种模式是事件驱动的编程基石，它有利益于良好的面向对象的设计
document.body.addEventListener("click", function(){
alert("hello world")
},false)
document.body.click() // 模拟用户点击
总结：在上面的例子中，需要监听用户点击 document.body 的动作，但是我们是没办法预知用户将在什么时候点击的，因此我们订阅了 document.body 的 click 事件，当 body 节点被点击时，body 节点便会向订阅者发布 "Hello World" 消息。
策略模式
策略模式指的是定义一些列的算法，把他们一个个封装起来，目的就是将算法的使用与算法的实现分离开来，避免多重判断条件，更具有扩展性。
总结：在上面的代码中，通过策略模式，使得客户的折扣与算法解藕，又使得修改跟扩展能独立的进行，不影到客户端或其他算法的使用。
当我们的代码中有很多个判断分支，每一个条件分支都会引起该“类”的特定行为以不同的方式作出改变，这个时候就可以使用策略模式，可以改进我们代码的质量，也更好的可以进行单元测试。
