Skip to content

访问器装饰器

定义

访问器装饰器(Accessor Decorator)是 TypeScript 中用于修饰类中 getter/setter 访问器 的特殊函数,通过 @expression 语法附加在访问器声明前,可监视、修改或替换访问器的定义。

基本语法

typescript
/* 
  参数说明:
    ○ target: 
        1. 对于实例访问器来说值是【所属类的原型对象】。
        2. 对于静态访问器来说值是【所属类】。
    ○ propertyKey:访问器的名称。
    ○ descriptor: 描述对象。
*/
function Demo(
  target: object,
  propertyKey: string,
  descriptor: PropertyDescriptor
) {
  console.log(target);
  console.log(propertyKey);
  console.log(descriptor);
}

class Person {
  @Demo
  get address() {
    return "中国浙江杭州";
  }
  @Demo
  static get country() {
    return "中国";
  }
}

应用举例

需求:对 Weather 类的 temp 属性的 set 访问器进行限制,设置的最低温度-50,最高温度 50

typescript
function RangeValidate(min: number, max: number) {
  return function (
    target: object,
    propertyKey: string,
    descriptor: PropertyDescriptor
  ) {
    // 保存原始的 setter 方法,以便在后续调用中使用
    const originalSetter = descriptor.set;

    // 重写 setter 方法,加入范围验证逻辑
    descriptor.set = function (value: number) {
      // 检查设置的值是否在指定的最小值和最大值之间
      if (value < min || value > max) {
        // 如果值不在范围内,抛出错误
        throw new Error(`${propertyKey}的值应该在 ${min}${max}之间!`);
      }

      // 如果值在范围内,且原始 setter 方法存在,则调用原始 setter 方法
      if (originalSetter) {
        originalSetter.call(this, value);
      }
    };
  };
}

class Weather {
  private _temp: number;
  constructor(_temp: number) {
    this._temp = _temp;
  }
  // 设置温度范围在 -50 到 50 之间
  @RangeValidate(-50, 50)
  set temp(value) {
    this._temp = value;
  }
  get temp() {
    return this._temp;
  }
}

const w1 = new Weather(25);
console.log(w1);
w1.temp = 67;
console.log(w1);