设计模式简介

设计模式

一、 设计模式的目的是什么?

• 降低功能的复杂性，尽可能的减少耦合度。减少代码的复杂性就意味着代码耦合度高，所以要权衡
• 尽量实现单一性原则，一个函数只执行的一个功能
• 如果要扩展功能，尽量不要修改父类，使用继承的方式，修改子类
• 如果代码的耦合度高，耦合度超过3个，那么可以考虑使用VUEX的理念，数据统一管理，通过指定的方式获取和修改数据
• 定义函数时，要考虑代码的复用性

二、 有哪些设计模式？

• 单例模式
  • 定义：保证一个类仅有一个实例，并提供一个全局访问点。
  • 人话：能够重复使用创建的某个对象，且这个对象重头到位只会被创建一次
  • 俗：小明有一双发现爱与美的眼睛，每次撩妹都是一个套路，区别就是妹纸换了；假装偶遇、获取联系方式、有事没事就关心、一个月没到手就换目标的原则…呸，渣男！
  • 应用场景：消息提示框的重复使用，只创建一个，后面再使用就修改文本内容就可以了
• 代理模式
  • 人话：通过第三方触发要执行的功能，比如执行函数A。通过执行事件B间接触事件A。事件B中可以添加某些条件，当满足条件后才出触发时间A。
  • 俗：小明要买电脑，他爹出钱。但是小明依然不能完全做主，他妈帮他把关。这个配置价格高了，不合适；这个配置太好了，影响你学习；这个太花哨了，务实些…；最后小明买了台学生机
  • 应用场景：图片资源的预加载和懒加载。图片默认显示预先设定好的图片，也就是图片占位；再通过代理模式创建一个img标签DOM对象，将要加载的资源路劲挂载img标签DOM对象的Src上，当图片资源获取完后，再替换页面中需要显示的图片位置。
• 策略模式：
  • 人话： 将需要执行的功能先统一放在一起某个池子中，先不执行；当满足某个条件或主动触发时，将所有功能一起执行。
  • 俗： 小明在家准备做饭，到超市里买肉、调料、锅碗瓢盆、蔬菜…；装在购物车中一起付款带回家。除非小明疯了，在厨房里想起一样就去超市买一样。
  • 应用场景：
    • 上传多张图片时，先将需要上传的图片放在一起，最后统一上传，减少服务端压力。
    • 发送表单数据前的表单验证
• 工厂方法模式
  • 人话：创建某个类，将需要创建的子类方法写在类原型链上，子类方法中的多次使用的方法也写在类原型链上；实例化子类（new 方式创建）时；
    将子类的原型链修改，指向类原型链，这就可以使用类的其他方法。
    俗：小明他爹挣得钱都由小明继承，也会教小明挣钱的方式。但是，他爹妈想要个妹妹，然后就一直new()，然而得到的全是弟弟，忘了修改sex的值…；但这并不妨碍弟弟们和小明分家产…
  • 应用场景：需要使用创建多个类似的对象时，可以采用该设计模式
• 包装模式：
  • 人话：不修改原有的方法或对象，在此基础上新增自己要实现的功能或方法
  • 俗：小明要结婚了，掏空身体买了套二手房，再此基础上新增两个红色灯笼，包装一下，就成婚房了。嗯，吃个持家的人…
  • 应用场景：二次开发或新增功能时
• 观察者模式：
  • 人话：有A、B、C三个对象，C充当观察者，当C发生变化时，A、B对象也会发生变化
  • 俗：小明成家后，媳妇儿的脸色就是晴雨表，稍有不慎就是风云变幻之际，小明和Babey处理瑟瑟发抖就是抱团取暖…察言观色方是求生之道
  • 应用场景： VUE、react框架中的观察者模式就是这种思想