Skip to content

JS常见设计模式

https://juejin.cn/post/6911867371896602632)(https://juejin.cn/post/6844903651480174605)

工厂模式

  • jQuery $ 函数
  • Vue _createElementVNode
  • React createElement

单例模式

  • 登录框
  • Vuex store

原型模式

  • JS原型和原型链
  • Object.create
  • 对象属性描述符

策略模式

  • Vue 生命周期回调函数分发

代理模式

  • DOM事件代理
  • Webpack devServer
  • nginx 反向代理
  • Proxy 和 Reflect

中介者模式

装饰者模式

  • Decorator语法
  • AOP面向切面编程

发布订阅模式/观察者模式

  • DOM事件
  • React Vue 组件生命周期
  • Vue watch
  • Vue 组件更新过程
  • MutationObserver
  • 自定义事件 EventBus
  • postMessage

适配器模式

  • Symbol.iterator
  • for...of
  • Generator 和 yield

迭代器模式

桥接模式

外观模式

访问者模式

模板方法模式

组合模式

备忘录模式

职责链模式

状态模式

享元模式