设计模式#

源自，设计模式介绍

设计模式，是软件设计中常见问题的典型解决方案。

模式包含哪些内容？

• 意图：简单描述问题和解决方案
• 动机：进一步解释问题并说明模式会如何提供解决方案
• 结构：展示模式的每个部分和它们之间的关系
• 不同语言中实现：提供流行编程语言的代码

创建型设计模式#

用于描述“怎么创建对象”。 它的主要特点是“将对象的创建与使用分离”。 如，单例、原型、工厂方法、抽象工厂、建造者等5种创建型模式。

提供创建对象的机制，增加已有代码的灵活性和可复用性。

1. 简单工厂模式#

又称静态工厂模式，由一个工厂对象决定创建某一种产品对象类的实例。主要用来创建同一类对象。

2. 工厂方法模式#

定义一个用于创建产品的接口，由子类决定生产什么产品.

3. 抽象工厂模式#

提供一个创建产品族的接口，其每个子类可以生产一系列相关的产品。

4. 建造者模式#

将一个复杂对象分解成多个相对简单的部分，然后根据不同需要分别创建它们，最后构建成该复杂对象。

5. 原型模式#

将一个对象作为原型，通过对其进行复制而克隆出多个和原型类似的新实例。

6. 单例模式#

某个类只能生成一个实例，该类提供了一个全局访问点供外部获取该实例，其拓展是有限多例模式。

结构性设计模式#

用于描述“如何将类或对象按某种布局组成更大的结构”。 如，代理、适配器、桥接、装饰、外观、享元、组合等7种结构型模式。

如何将对象和类组装成较大的结构，并同时保持结构的灵活和高效。

7. 外观模式#

8. 适配器模式#

9. 代理模式#

10. 装饰者模式#

11. 桥接模式#

12. 组合模式#

13. 享元模式#

行为型设计模式#

用于描述“类或对象之间怎样相互协作共同完成单个对象无法单独完成的任务，以及怎样分配职责”。 如，模板方法、策略、命令、职责链、状态、观察者、中介者、迭代器、访问者、备忘录模式、解释器等11中行为模式。

负责对象间的高校沟通和职责委派

14. 模版方法模式#

15. 观察者模式#

又称 发布-订阅模式，核心 API：on、emit

• on：订阅
• emit：发布
• off：删除

class customEventEmitter {
  constructor() {
    this.eventMap = {}
  }

  on = (type, handler) => {
    if (!(handler instanceof Function)) {
      throw new Error('need a function parameter')
    }
    if (!this.eventMap[type]) {
      this.eventMap[type] = []
    }
    this.eventMap[type].push(handler)
  }

  emit = (type, payload) => {
    if (this.eventMap[type]) {
      this.eventMap[type].forEach((handler, index) => {
        handler(payload)
      })
    }
  }

  off = (type, handler) => {
    if (this.eventMap[type]) {
      const idx = this.eventMap[type].indexOf(handler)
      if (idx >= 0) {
        this.eventMap[type].splice(this.eventMap[type].indexOf(handler) >>> 0, 1)
      }
    }
  }
}

测试

const e = new customEventEmitter()

const fn1 = p => console.log('fn1:', p)
const fn2 = p => console.log('fn2:', p)

e.on('one', fn1)
e.on('one', fn2)

e.emit('one', 123)
// fn2: 123
// fn1: 123

e.off('one', fn2)

e.emit('one', 123)
// fn1: 123

16. 状态模式#

17. 策略模式#

18. 职责链模式#

19. 命令行模式#

20. 访问者模式#

21. 中介者模式#

22. 备忘录模式#

23. 迭代器模式#

24. 解释器模式#

技巧性设计模式#

25. 链模式#

26. 委托模式#

27. 数据访问对象模式#

28. 节流模式#

29. 简单模版模式#

30. 惰性模式#

31. 参与者模式#

32. 等待者模式#

架构型设计模式#

33. 同步模块模式#

34. 异步模块模式#

35. Widget 模式#

36. MVC 模式#

37. MVP 模式#

38. MVVM 模式#