设计模式5

101 阅读2分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第7天,点击查看活动详情

装饰器模式

  • 在不改变其原有的结构和功能为对象添加新功能的模式其实就叫做装饰器模式
  • 最直观地就是我们买房后的装修
  • 装饰比继承更加灵活,可以实现装饰者和装饰器之间松耦合
  • 被装饰者可以使用装饰者动态地增加和撤销功能
abstract class Shape{
    abstract draw():void;
}
class Circle extends Shape{
    draw(){
        console.log('绘制圆形');
    }
}
class Rectangle extends Shape{
    draw(){
        console.log('绘制矩形');
    }
}
abstract class ColorfulShape extends Shape{
    constructor(public shape:Shape){
        super();
    }
    abstract draw():void;
}
class RedColorfulShape extends ColorfulShape{
    draw(){
        this.shape.draw();
        console.log('把边框涂成红色')
    }
}
class GreenColorfulShape extends ColorfulShape{
    draw(){
        this.shape.draw();
        console.log('把边框涂成绿色')
    }
}
//画一个红色的圆形
let redColorfulShape = new RedColorfulShape(new Circle());
redColorfulShape.draw();

应用场景:

  • 装饰器
    • 装饰器是一种特殊类型的声明,它可能被附加到类声明、方法、属性或参数上,可以修改类的行为
    • 常见的装饰器有类装饰器,属性装饰器,方法装饰器和参数装饰器
    • 装饰器的写法分为普通装饰器和装饰器工厂

image.png image.png

  • AOP概念
    • 在软件业,AOP意为面向切面编程
    • 可以通过预编译方式和运行期动态代理实现在不修改源代码的情况下给程序动态统一添加功能的一种技术
  • 埋点
    • 埋点分析:是网站分析的一种常用的数据采集方法
    • 无痕埋点:通过技术手段,完成对用户行为数据无差别的统计上传的工作,后期数据分析处理的时候通过技术手段筛选出合适地数据进行统计分析
  • 表单校验

外观模式

该模式就是把一些复杂的流程封装成一个接口供给外部用户更简单的使用

  • 门面角色:外观模式的核心。它被客户角色调用,它熟悉子系统的功能
  • 子系统角色:实现了子系统的功能,它对客户角色和门面是未知的。
  • 客户角色:通过调用门面来完成要实现的功能

image.png

image.png

image.png 场景:

  • 为复杂的模块或子系统提供外界访问的模块
  • 子系统相互独立 如redux