简介

可重用的方案, 可应用与在软件设计中的常见问题

优点

  • 行之有效的解决方法: 提供固定的解决方案来解决在软件开发中出现的问题
  • 很容易的重用: 反映一个可以适应自己需要的开箱即用的解决方案
  • 善于表达: 有一组结构和词汇可以非常优雅的帮助表达相当大的解决方案

分类

  • 创建型模式: 关注与对象创建的机制方法, 通过该方法, 对象以适应工作环境的方式被创建, 基本的对象创建方法可能会给项目增加额外的复杂性

包括: 构造器模式(Constructor) 工厂模式(Factory) 抽象工厂模式(Abstract) 原型模式(Prototype) 单例模式(Singleton) 以及 建造者模式(Builder)

  • 行为设计模式: 关注改善或精简在系统中不同对象的通信

包括: 迭代模式 中介者模式 观察者模式 访问者模式

  • 结构设计模式: 关注与对象和通常识别的方式实现不同对象之间的关系, 该模式有助于在系统的某一部分发生改变的时候,整个系统结构不需要改变, 该模式同样有助于对系统中某部分没有达到某一目的的部分进行重组

包括: 装饰模式 外观模式 亨元模式 适配器模式 代理模式

概览

SN 描述
Creational 创建型 根据创建对象的概念分成下面几类。
Class
Factory Method(工厂方法) 通过将数据和事件接口化来构建若干个子类。
Object
Abstract Factory(抽象工厂) 建立若干族类的一个实例,这个实例不需要具体类的细节信息。(抽象类)
Builder (建造者) 将对象的构建方法和其表现形式分离开来,总是构建相同类型的对象。
Prototype(原型) 一个完全初始化的实例,用于拷贝或者克隆。
Singleton(单例) 一个类只有唯一的一个实例,这个实例在整个程序中有一个全局的访问点。
Structural 结构 根据构建对象块的方法分成下面几类。
Class
Adapter(适配器) 将不同类的接口进行匹配,调整,这样尽管内部接口不兼容但是不同的类还是可以协同工作的。
Bridge(桥接模式) 将对象的接口从其实现中分离出来,这样对象的实现和接口可以独立的变化。
Composite(组合模式) 通过将简单可组合的对象组合起来,构成一个完整的对象,这个对象的能力将会超过这些组成部分的能力的总和,即会有新的能力产生。
Decorator(装饰器) 动态给对象增加一些可替换的处理流程。
Facada(外观模式) 一个类隐藏了内部子系统的复杂度,只暴露出一些简单的接口。
Flyweight(享元模式) 一个细粒度对象,用于将包含在其它地方的信息 在不同对象之间高效地共享。
Proxy(代理模式) 一个充当占位符的对象用来代表一个真实的对象。
Behavioral 行为 基于对象间作用方式来分类。
Class
Interpreter(解释器) 将语言元素包含在一个应用中的一种方式,用于匹配目标语言的语法。
Template Method(模板方法) 在一个方法中为某个算法建立一层外壳,将算法的具体步骤交付给子类去做。
Object
Chain of Responsibility(响应链) 一种将请求在一串对象中传递的方式,寻找可以处理这个请求的对象。
Command(命令) 封装命令请求为一个对象,从而使记录日志,队列缓存请求,未处理请求进行错误处理 这些功能称为可能。
Iterator(迭代器) 在不需要直到集合内部工作原理的情况下,顺序访问一个集合里面的元素。
Mediator(中介者模式) 在类之间定义简化的通信方式,用于避免类之间显式的持有彼此的引用。
Observer(观察者模式) 用于将变化通知给多个类的方式,可以保证类之间的一致性。
State(状态) 当对象状态改变时,改变对象的行为。
Strategy(策略) 将算法封装到类中,将选择和实现分离开来。
Visitor(访问者) 为类增加新的操作而不改变类本身。

资料

视频

Egghead
Javascript Object creation patterns tutorial: youtobe

参考

w3cschool
Javascript 设计模式参考资料

JS The Right Way
Javascript Design Patterns: joezimjs.com
Javascript Design Patterns: dofactory.com
js-design-patterns: github.com
javascript_design_patterns: seesparkbox.com
Learning Javascript Design Patterns: addyosmani.com 书 *
Javasript Design Patterns: medium
Understanding Design Patterns in Javascript: medium
4 Javascript Design Patterns You Should Know: scotch.io
基本设计模式: scotch.io
Javascript 设计模式: legacy.gitbook.com
设计模式综合指南: Toptal
十大常用设计模式: 掘金*
Javascript 设计模式与开发实践 知识汇总: 掘金
设计模式六大原则
web 前端进阶之 js 设计模式之设计原则篇
3 个设计原则、14 个设计模式、9 个技巧
视频

PDF

百度云盘 Javascript设计模式.pdf: 提取码: xiui
百度网盘 常见设计模式: 提取码: drgc
【译文】你需要知道的四种JavaScript设计模式.md
(终极篇)JAVASCRIPT设计模式.pdf

React

How To Master Advanced React Design Patterns-Context API

Flux

Flux vs. MVC(Design Patterns)

小结

待本书翻阅完毕后,或许记不得太多, 但至少应该能够说出全部的设计模式名称及主要常见的模式的使用方法以及场景, 各个设计模式的场景以及在哪种情景下需要使用哪种模式
在接触了有些开发者之后, 只能初步判定, 至少 百分之八十左右的开发者不能真正的理解设计模式的应用场景及如何合理的使用设计模式, 这也就限制了只能对常见的业务场景虽然可以快速的解决掉, 但假设对其代码进行 Review 之后就会发现, 真正将模式开发的方式应用到业务场景中去是多么的困难, 致使其代码的不合理性以及执行的性能降低(虽然现在主流浏览器对其执行性能做了大大的提升, 以及如今的网络也比较快, 就算是如此,我们更应该对代码在质量上进行大大的提升)
在此想法上, 假设我们能够及时的对代码的质量以及开发过程中的合理性进行 Review 的话, 是不是能够帮助我们有更快的更高的提升呢, 或许也能够对别人的前进的道路上能够有重新的定义
视频