chenhui996 / design-mode-front

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

前端设计模式 - 学习

从设计到模式

23 种设计模式

  • 创建型。
  • 组合型。
  • 行为型。

创建型

对象如何创建、如何生成。

  • 工厂模式(工厂方法模式,抽象工厂模式,建造者模式)。(这里代表 3 种)
  • 单例模式。
  • 原型模式。

组合型

一些对象或类,该是何种组合形式。(因为单靠一个对象或类,很难满足完整的需求)

  • 适配器模式。
  • 装饰器模式。
  • 代理模式。
  • 外观模式。
  • 桥接模式。
  • 组合模式。
  • 享元模式。

受限于使用场景于 js 的语法环境,主要学习前四种。(不是说后三种不要学,而是要有主次)

行为性

涵盖日常开发中的一些常用行为。这些常用行为该如何:去开发、去布置、去做,才能满足设计原则的要求

  • 策略模式。
  • 模版方法模式。
  • 迭代器模式。
  • 职责连模式。
  • 命令模式。
  • 备忘录模式。
  • 状态模式。
  • 访问者模式。
  • 中介者模式。
  • 解释器模式。

同样,其中也有优先级划分。


分优先级

  • :前端常用设计模式。
  • :前端非常用设计模式。
  • 次后:前端少用设计模式。

综合实训

  • 实现一个简易的购物车组件。
  • 切到 cart 分支进行查阅。

About


Languages

Language:JavaScript 98.5%Language:HTML 1.5%