Web前端高级工程师培训:设计模式相关

设计模式相关

本节知识点

  • 工厂模式及自定义事件
  • 抽离英雄基类
  • 设计原则
  • 单例模式使用
  • 装饰者模式使用
  • 代理模式
  • 观察者模式
  • 适配器模式...

课堂目标

  • 学会各种设计模式的使用
  • 学会面向对象中抽象使用
  • 理解类中的继承
  • oop思想规划项目

设计原则

SOLID(稳定的)

  • 单一职责原则(Single Responsibility Principle)

    一个类应该只有一个发生变化的原因。简而言之就是每个类只需要负责自己的那部分,类的复杂度就会降低。

  • 开闭原则(Open Closed Principle)

    • 一个软件实体,如类、模块和函数应该对扩展开放,对修改关闭
  • 里氏替换原则(Liskov Substitution Principle)

    所有引用基类的地方必须能透明地使用其子类的对象,也就是说子类对象可以替换其父类对象,而程序执行效果不变。

  • 迪米特法则(Law of Demeter)

    迪米特法则(Law of Demeter)又叫作最少知识原则(The Least Knowledge Principle),一个类对于其他类知道的越少越好,就是说一个对象应当对其他对象有尽可能少的了解,只和朋友通信,不和陌生人说话。

  • 接口隔离原则(Interface Segregation Principle) flow 、ts

    • 多个特定的客户端接口要好于一个通用性的总接口
  • 依赖倒置原则(Dependence Inversion Principle)

    1、上层模块不应该依赖底层模块,它们都应该依赖于抽象。

    2、抽象不应该依赖于细节,细节应该依赖于抽象

案例内容扩展

  • 扩展皮肤功能

  • 抽离英雄基类

    • 每个英雄的共有属性
    • 共有方法及独特方法
  • 抽离技能基类

设计模式

​ 设计模式是软件开发人员在软件开发过程中面临的一些具有代表性问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的;

单例模式

  • 单例模式 (Singleton Pattern)又称为单体模式,保证一个类只有一个实例,并提供一个访问它的全局访问点。也就是说,第二次使用同一个类创建新对象的时候,应该得到与第一次创建的对象完全相同的对象。

    • 通过静态属性创建单例

      js 复制代码
      class Person{
          static instance = null;
          constructor(name){
              if(Person.instance){
                  return Person.instance;
              }
              Person.instance = this;
              this.name = name;
          }
      }
    • 通过函数创建单例

      js 复制代码
      let instance;
      function createInstance(...arg){
          if(!instance){
              instance = new Game(...arg);
          }
          return instance;
      }
    • 实现game类的单例

      • 优:单例模式节约内存开支和实例化时的性能开支,节约性能;
      • 缺:单例模式扩展性不强

工厂模式

  • 工厂模式 (Factory Pattern),封装具体实例创建逻辑和过程,外部只需要根据不同条件返回不同的实例。
    • 优点:实现代码复用性,封装良好,抽象逻辑;
    • 缺点:增加了代码复杂程度;

装饰者模式

  • 装饰者模式 (Decorator Pattern)使用一种更为灵活的方式来动态给一个对象/函数等添加额外信息
    • 扩展功能 和继承类似
    • 扩展不同类的功能,和原始类并无关联;

观察者模式(自定义事件)

  • 观察者模式 (Observer Pattern) 定义一个对象与其他对象之间的一种依赖关系,当对象发生某种变化的时候,依赖它的其它对象都会得到更新
    • 自定义事件绑定addEvent
    • 自定义事件触发trigger
    • 自定义事件移除removeEvent
  • 实现案例GameEvent类

代理模式

  • 代理模式 为其他对象提供一种代理以控制对这个对象的访问,类似于生活中的中介。
    • 为hero添加代理模式 控制 伤害的输出

适配器模式

  • 两个不兼容的接口之间的桥梁,将一个类的接口转换成客户希望的另外一个接口。适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。

享元模式

享元模式:运用共享技术来有效地支持对象的复用,以减少创建的对象的数量。

  • 通过共享对象节约内存资源,提高性能和效率

课程总结

  • 工厂模式及观察者模式
  • 抽离英雄基类
  • 抽离技能基类
  • 扩展皮肤类
  • 单例模式使用
  • 装饰者模式使用
  • 代理模式
相关推荐
hhwyqwqhhwy28 分钟前
设备树之 provider 和 consumer
java·linux·前端
垆边人似月.2 小时前
Python中如何使用get函数实现频次查询
服务器·前端·python
moshuying2 小时前
DeepSeek开源生产级推理框架DeepInfer:单集群一天处理155万亿token,这意味着什么?
前端
子兮曰3 小时前
PHP漏洞危机,你的网站升级了吗?
前端·后端·php
jerrywus3 小时前
给 Pi 装上生图插件:从登录报错到画出一只 200×200 的猫
前端·agent·claude
陈随易3 小时前
搞钱点子之生态鱼缸
前端·后端·程序员
PBitW3 小时前
从空目录到上线:我全程用 TRAE 做了一款微信小游戏合集(含一次完整架构重构)
前端·trae
不爱学英文的码字机器3 小时前
从Q1迁到T1,同一个编号已经换了含义
前端·数据库·microsoft
云和数据.ChenGuang3 小时前
光哥说Python 循环导入(Circular Import)深度解析:成因、排查与解决方案
开发语言·前端·人工智能·python·langchain
avi91113 小时前
【AI教人】在Inspector显示所有Delegate-Odin Inspector之三
java·前端·算法·delegate·inspector·editor扩展·unity editor