TypeScript学习八：装饰器

类装饰器

function setName() {
  console.log("get setName");
  return (target: any) => {
    console.log("setName");
  };
}
function setAge() {
  console.log("get setAge");
  return (target: any) => {
    console.log("setAge");
  };
}
// 不使用修饰器工厂
function setClass(target: any) {
  console.log("setClass");
}

// 执行结果顺序 setName() => setAge() => setClass => setAge => setName
@setName()
@setAge()
@setClass
class ClassDec {
  constructor(public name: string) {
    this.name = "123";
  }
}

方法装饰器

• target: any 修饰的对象
• propertyName: string 被修饰方法的名字
• descriptor: PropertyDescriptor 一个对象，被修饰方法的属性描述符

function enumerable(bool: boolean) {
  return (target: any, propertyName: string, descriptor: PropertyDescriptor) => {
    console.log(target, propertyName, descriptor);
    descriptor.enumerable = bool;
  };
}
class ClassObj {
  constructor(public age: number) {}
  // true: getAge可被枚举 =》age getAge
  // false: getAge不可被枚举 =》age
  @enumerable(true)
  public getAge() {
    return this.age;
  }
}
const classObj = new ClassObj(18);
for (const key in classObj) {
  if (key) {
    console.log(key);
  }
}

访问器装饰器

class ClassObj1 {
  private _name: number;
  constructor(name: number) {
    this._name = name;
  }
  // 装饰器方法与上面一致
  @enumerable(true)
  get name() {
    return this._name;
  }
  set name(name) {
    this._name = name;
  }
}

属性装饰器

• target: 修饰的目标
• propertyName: 被修饰的属性名

function printPropertyName(target: any, propertyName: string) {
  console.log("属性装饰器：", propertyName);
}
class ClassObj2 {
  @printPropertyName
  public name: string;
  constructor(name: string) {
    this.name = name;
  }
}

参数修饰器

• target: 当前的类
• propertyName: 被修饰参数对应的方法名
• index: 被修饰参数的下标

function required(target: any, propertyName: string, index: number) {
  console.log(`修饰的是${propertyName}的第${index + 1}个参数`);
}
class ClassObj3 {
  public getInfo(prefix: string, @required infoType: string): any {
    return prefix + " " + infoType;
  }
}
interface ClassObj4 {
  [key: string]: string | number;
}
const classObj4 = new ClassObj3();
classObj4.getInfo("hi:", "age");