浅谈Typescript 装饰器执行顺序

function first() {
  console.log('first(): 工厂求值');
  return function (target: any, propertyKey?: string, descriptor?: PropertyDescriptor) {
    console.log('first(): 装饰器执行');
  };
}

function second() {
  console.log('second(): 工厂求值');
  return function (target: any, propertyKey?: string, descriptor?: PropertyDescriptor) {
    console.log('second(): 装饰器执行');
  };
}

class Example {
  @first()
  @second()
  method() {}
}

function classDecorator() {
  console.log('类装饰器工厂');
  return function (constructor: Function) {
    console.log('类装饰器执行');
  };
}

function propertyDecorator(name: string) {
  console.log(`属性装饰器工厂: ${name}`);
  return function (target: any, propertyKey: string) {
    console.log(`属性装饰器执行: ${name}`);
  };
}

function methodDecorator(name: string) {
  console.log(`方法装饰器工厂: ${name}`);
  return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    console.log(`方法装饰器执行: ${name}`);
  };
}

function parameterDecorator(name: string) {
  console.log(`参数装饰器工厂: ${name}`);
  return function (target: any, propertyKey: string, parameterIndex: number) {
    console.log(`参数装饰器执行: ${name}`);
  };
}

@classDecorator()
class Demo {
  @propertyDecorator('实例属性')
  instanceProp: string;

  @propertyDecorator('静态属性')
  static staticProp: string;

  constructor(@parameterDecorator('构造参数') param: string) {
    this.instanceProp = param;
  }

  @methodDecorator('实例方法')
  instanceMethod(@parameterDecorator('实例方法参数') arg: number) {}

  @methodDecorator('静态方法')
  static staticMethod(@parameterDecorator('静态方法参数') arg: number) {}
}