JavaScript 设计模式总结

概览

设计模式.mindnode.zip

代码示例

代码示例使用 CodeSandBox.io 需要代理以获得最佳使用体验。

单例模式

• 全局登陆框
• install 方法返回单个实例

策略模式

• 封装动画缓动策略
  
• 表单验证策略

代理模式

• 图片预加载
• 合并多次 http 请求
• 缓存计算结果

迭代器模式

• $.each 函数的实现
• 获取兼容对象

发布订阅模式

• 商城网站登录联动
• EventBus
• Dom 事件监听
• 增强版 EventBus

命令模式

• 菜单程序
• 撤销命令
• 宏命令（封装一组指令）

组合模式

• 组合宏命令
• 扫描文件夹

模板模式

• 实现子类继承抽象父类

享元模式

• 模特拍照
• 文件批量上传
• 对象池

职责链模式

• 商城订单计算程序
• AOP：抽离业务无关的逻辑
• 使用职责链获取兼容对象

中介者模式

• 泡泡堂游戏

装饰者模式

• window.onload
• 数据上报
• AOP 动态改变函数参数
• 表单验证插件

状态模式

• 开关灯（状态模式前后对比）
• 有限状态开关灯
• 多状态的上传文件管理
• 有限状态机三方库

适配器模式

• 统一地图接口
• 解决兼容问题

扩展阅读

• 图说设计模式