探秘 TypeScript 中的装饰器：揭秘其基本语法

引言

在 TypeScript 中，装饰器是一种强大的机制，可用于增强代码的功能和行为。它们允许开发人员在编译时添加元数据，从而扩展类的结构和行为。本文将深入探讨装饰器的基本语法，为读者提供深入理解其工作原理所需的知识。

装饰器的类型

TypeScript 中有三种主要的装饰器类型：

• 类装饰器： 应用于类，用于修改类本身的行为。例如，可以添加元数据或验证类结构。
• 属性装饰器： 应用于类属性，用于修改属性的行为。例如，可以验证属性类型或设置默认值。
• 方法装饰器： 应用于类方法，用于修改方法的行为。例如，可以记录方法调用或验证方法参数。

基本语法

装饰器的基本语法如下：

@decoratorName
class MyClass { ... }

@decoratorName(options)
class MyClass { ... }

@decoratorName
property: type;

@decoratorName(options)
property: type;

@decoratorName
methodName(args: type[]) { ... }

@decoratorName(options)
methodName(args: type[]) { ... }

• @decoratorName： 装饰器的名称。
• (options)： 装饰器接受的可选选项。
• property： 属性的名称。
• type： 属性的数据类型。
• methodName： 方法的名称。
• args： 方法参数的类型数组。

示例

下面是一个简单的装饰器示例，用于记录类中方法的调用：

function logMethod(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
  // 保存原始方法
  const originalMethod = descriptor.value;

  // 重写方法以记录调用
  descriptor.value = function(...args: any[]) {
    console.log(`Calling ${propertyKey} with args: ${args}`);
    // 调用原始方法
    return originalMethod.apply(this, args);
  };
}

class MyClass {
  @logMethod
  greet(name: string) {
    console.log(`Hello, ${name}!`);
  }
}

**