跳到主要内容

TypeScript 什么是装饰器,它们可以应用于什么?

参考答案:

装饰器(Decorators)是 TypeScript(以及 ES7/ES2018+ 的 JavaScript)中的一个特性,它们允许你为类、方法、属性或参数添加额外的元数据或行为。装饰器本质上是一个特殊的声明,它可以附加到类声明、方法、属性或参数上。装饰器使用 @expression 这样的形式,其中 expression 必须计算为一个函数,该函数将在运行时被调用。

装饰器可以用于多种目的,例如:

  1. 日志:你可以为类、方法或属性添加日志装饰器,以便在调用它们时记录相关信息。
  2. 验证:你可以为类属性添加验证装饰器,以确保它们的值满足特定条件。
  3. 依赖注入:在依赖注入框架中,装饰器可以用于标识需要注入的依赖项。
  4. 性能分析:你可以为方法添加性能分析装饰器,以测量它们的执行时间。
  5. 修改或增强方法行为:例如,你可以创建一个装饰器,用于在方法执行前后添加额外的行为,如权限检查、缓存等。

以下是一个简单的装饰器示例,它用于在方法执行前后添加日志:

function log(target: any, propertyName: string, descriptor: PropertyDescriptor) {
  const originalMethod = descriptor.value;
  descriptor.value = function (...args: any[]) {
    console.log(`Calling ${propertyName} with`, args);
    const result = originalMethod.apply(this, args);
    console.log(`Called ${propertyName}, result is`, result);
    return result;
  };
  return descriptor;
}

class MyClass {
  @log
  myMethod(message: string) {
    return `Hello, ${message}!`;
  }
}

const myInstance = new MyClass();
console.log(myInstance.myMethod("World"));

在上面的示例中,@log 是一个装饰器,它会在 myMethod 方法执行前后添加日志。当你调用 myInstance.myMethod("World") 时,你将在控制台看到类似以下的输出:

Calling myMethod with [ 'World' ]
Called myMethod, result is Hello, World!
Hello, World!

需要注意的是,虽然装饰器在 TypeScript 中非常有用,但它们并不是 TypeScript 的核心特性。它们是基于 ECMAScript 提案的,因此在某些环境中可能需要额外的配置或转译步骤才能使用。