前端设计模式 | 青训营笔记

60 阅读2分钟

这是我参与「第四届青训营」笔记创作活动的的第6天,设计模式是一套被反复使用的、多数人知晓的、经过分类编目的、代码设计经验的总结。在面向对象软件设计过程中针对特定问题的优雅而简洁的解决方案。在这堂课中主要学习了一些传统的基于面向的设计模式在前端中的应用场景,以及一些已经过时的设计模式。

一、前端中常见的设计模式

设计模式按照分类分为三大类:创建型模式、结构型模式、行为型模式;总共是有23种设计模式。

  • 创建型模式 - 单例设计模式、工厂方法模式、抽象工厂模式、建造者模式、原型模式

  • 结构型模式 - 装饰器模式、代理模式、适配器模式、桥接模式、组合模式、外观模式、享元模式

  • 行为型模式 - 模板设计模式、命令模式、迭代器模式、观察者模式、中介者模式、备忘录模式、接解释器模式、状态模式、策略模式、职责链模式、访问者模式。

2. 设计原则

  • S – Single Responsibility Principle

单一职责原则,一个程序只做好一件事,如果功能过于复杂就拆分开,每个部分保持独立。

  • O – OpenClosed Principle

开放/封闭原则,对扩展开放,对修改封闭,增加需求时,扩展新代码,而非修改已有代码。

  • L – Liskov Substitution Principle

里氏替换原则,子类能覆盖父类,父类能出现的地方子类就能出现。

  • I – Interface Segregation Principle

接口隔离原则,保持接口的单一独立,类似单一职责原则。

  • D – Dependency Inversion Principle

依赖倒转原则,面向接口编程,依赖于抽象而不依赖于使用方只关注接口而不关注具体类的实现。

3.JS中的设计模式

原型模式 是指原型实例指向创建对象的种类,并通过拷贝这些原型创建新的对象,是一种用来创建对象的模式,也就是创建一个对象作为另一个对象的prototype属性。

代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问。

迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。