什么是设计模式
设计模式(Design pattern)代表了最佳的实践,通常被有经验的面向对象的软件开发人员所采用。设计模式是软件开发人员在软件开发过程中面临的一般问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的。
简单来说 它是一套被反复使用、多人知晓的、经过分类的、代码设计经验总结。
设计模式的原则
单一职责原则:就是功能要单一,简而言之就是一个类负责做一件事情。
开放封闭原则:对扩展开放,对修改关闭。
里氏替换原则:基类出现的地方,子类一定出现,不要破坏继承体系。
接口隔离原则:客户端不应该依赖它不需要的接口;一个类对另一个类的依赖应该建立在最小的接口上。
依赖翻转原则:针对接口编程,依赖抽象而不依赖具体。
合成复用原则:少用继承,多用合成方式实现。
前端常用设计模式
单例模式
这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。
这种模式涉及到一个单一的类,该类负责创建自己的对象,同时确保只有单个对象被创建。这个类提供了一种访问其唯一的对象的方式,可以直接访问,不需要实例化该类的对象。
单例模式是一种创建型设计模式,它确保一个类只有一个实例,并提供了一个全局访问点来访问该实例。
主要解决:一个全局使用的类频繁地创建与销毁。
何时使用:当您想控制实例数目,节省系统资源的时候。
如何解决:判断系统是否已经有这个单例,如果有则返回,如果没有则创建。
关键代码:构造函数是私有的。
常见实现方法,该方法在多线程的状态下不能正常工作,但是 js 是单线程工作,所以不用考虑这个问题
1 | public class Singleton { |
观察者模式
当对象间存在一对多关系时,则使用观察者模式(Observer Pattern)。比如,当一个对象被修改时,则会自动通知依赖它的对象。观察者模式属于行为型模式。
主要解决:一个对象状态改变给其他对象通知的问题,而且要考虑到易用和低耦合,保证高度的协作。
何时使用:一个对象(目标对象)的状态发生改变,所有的依赖对象(观察者对象)都将得到通知,进行广播通知。
如何解决:使用面向对象技术,可以将这种依赖关系弱化。
关键代码:在抽象类里有一个 ArrayList 存放观察者们。
发布订阅模式
其实 24 种基本的设计模式中并没有发布订阅模式,它只是观察者模式的一个别称。
但是经过时间的沉淀,似乎它已经强大了起来,已经独立于观察者模式,成为另外一种不同的设计模式。
在现在的发布订阅模式中,称为发布者的消息发送者不会将消息直接发送给订阅者,这意味着发布者和订阅者不知道彼此的存在。在发布者和订阅者之间存在第三个组件,称为调度中心或事件通道,它维持着发布者和订阅者之间的联系,过滤所有发布者传入的消息并相应地分发它们给订阅者。
1 | const EventEmit = function() { |
策略模式
主要解决:在有多种算法相似的情况下,使用 if…else 所带来的复杂和难以维护。
何时使用:一个系统有许多许多类,而区分它们的只是他们直接的行为。
如何解决:将这些算法封装成一个一个的类,任意地替换。
关键代码:实现同一个接口。
举个 🌰 : 表单验证中,要校验不同的规则,如果通过条件判断代码就会非常难以理解和维护,换成以下策略模式实现的方法,更加简洁明了
使用的时候,调用不同的类方法
装饰器模式
装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构。这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装。
装饰器模式通过将对象包装在装饰器类中,以便动态地修改其行为。
在前端中的应用 举个 🌰: HOC
定义一个黄色背景的高阶组件,既不影响子组件的结构,又拓展了组件的功能
1 | import React from 'react'; |