设计模式最终解决的还是代码的复用性与拓展性问题,故在实际开发中也不必完全拘泥于某一种设计模式开发。
简单工厂 plus 版本
抽象父类,字类继承抽象父类,具体业务逻辑实现在子类重写。
高定,创建一个含有多个类实例的对象。
类只会实例化一次。
也可用命名空间实现。
也可用闭包实现私有变量。
为一组复杂的子系统接口提供一个更高级的统一接口,通过这个接口使得对子系统接口的访问更容易。在JavaScript中有时也会用于对底层结构兼容性做统一封装来简化用户使用。
将一个类(对象)的接口(方法或者属性)转化成另外一个接口,以满足用户需求,使类(对象)之间接口的不兼容问题通过适配器得以解决。
如 Axios 源码中,判断环境是 Nodejs 还是 浏览器 环境,进而选择完全不同的处理机制的模式相同。
由于一个对象不能直接引用另一个对象,所以需要通过代理对象在这两个对象之间起到中介的作用。
在不改变原对象的基础上,通过对其进行包装拓展(添加属性或者方法)使原有对象可以满足用户的更复杂需求。
如 TypeScript 种的装饰器。
将业务逻辑抽象化(抽象类),桥接到具体的某个类,使其拓展功能。
组合若干个单体后的组合体,仍然具有单体的接口及组合特性,组合体本身仍然可以视为单体,即为组合模式表现。通常见于树形结构数据支撑的业务逻辑。
共享技术有效地支持大量的细粒度的对象,避免对象间拥有相同内容造成多余的开销。
Vue, React 的组件都可视为模板方法的例子。
发布订阅的思想,Vue 的响应式就是观察者模式。
简化程序中的判断分支,状态不可见,程序运行中决定状态,决定状态后调用相应的处理函数。
与状态模式相似,策略可见,同一个函数调用不通的策略函数。
细化功能颗粒度,将复杂逻辑分解为几个连续的过程,分别编码实现。
将方法封装在对象内部,外部以命令的方式调用。命令的发起者和命令的接受者解耦合。
对于数据结构较稳定而访问方式未抽象或易改变的情况,封装访问器,复用访问逻辑。
单向发布订阅模式。
一种缓存模式,类似带缓存的 proxy。
Vue 源码中 Utils.forEach 函数就是迭代器模式的例子。
解析文档或解释路径有特殊规则的情况下,会用到这种设计模式。
例如,return this 就可以实现链式调用。
优化绑定事件数量,把绑定在 li 标签上的事件改为绑定在 ul 标签上。
对访问数据的方法进行封装,如封装对 localstorage 或数据库的访问方法,达到优化与复用访问逻辑的目的。
将节点创建过程合并,节省 dom 创建的开销。
优化选择分支,一种是在脚本加载时重写,一种是第一次调用时重写。
bind 函数就是参与者模式,将参数原封不动地传递给另一个函数。
类似于 Promise.all 的实现。
SMD 模式,分而治之,模块化开发。
AMD 模式,实现异步模块机制,在模块加载完成前注册的事件全部存入缓存函数,在模块异步加载完成后触发缓存队列中的函数。
MVC 即 Model View Controller。
MVP 即 Model View Presenter。解开了 View 和 Model 的耦合。
MVVM 即 Model View ViewModle。Presenter 的 plus 版本,封装了一套响应数据的接口,对开发不可见。