TypeScript 装饰器是一种特殊类型的声明,能够被附加到类声明、方法、访问符、属性或参数上。它本质上是一个函数,会在运行时被调用,并且被装饰的声明信息会作为参数传递给装饰器函数。
装饰器的分类
-
类装饰器
-
类装饰器作用于类构造函数,可以修改或替换类定义。例如,可以使用类装饰器来禁止修改类的构造函数和原型。
function Sealed(constructor: Function) {Object.seal(constructor);Object.seal(constructor.prototype); }@Sealed class Report {title: string;constructor(t: string) { this.title = t; } }
-
-
方法装饰器
-
方法装饰器接收三个参数:目标类原型、方法名、方法描述符。它可以用于添加日志、权限控制或缓存逻辑。
function Cache(target: any, methodName: string, descriptor: PropertyDescriptor) {const originalMethod = descriptor.value;const cache = new Map();descriptor.value = function (...args: any[]) {const key = JSON.stringify(args);return cache.get(key) || (cache.set(key, originalMethod.apply(this, args)), cache.get(key));}; }class MathService {@Cachefibonacci(n: number): number { /* 计算逻辑 */ } }
-
-
属性装饰器
-
属性装饰器接收两个参数:目标类原型或类构造函数、属性名。它可以用于验证属性值或添加元数据。
function Format(target: any, propertyKey: string) {let value = target[propertyKey];Object.defineProperty(target, propertyKey, {set: (newVal) => { value = newVal.toUpperCase(); },get: () => value}); }class User {@Formatname: string; }
-
-
参数装饰器
-
参数装饰器接收三个参数:目标类原型或类构造函数、方法名、参数索引。它可以用于对类方法中的参数进行注解。
-
装饰器的使用
要使用装饰器,需要在 tsconfig.json
文件中启用 experimentalDecorators
选项。
{"compilerOptions": {"experimentalDecorators": true}
}
装饰器的执行顺序
-
装饰器表达式从上到下评估(工厂函数执行)。
-
装饰器函数从下到上调用(装饰逻辑执行)。
-
类装饰器最后执行。
-
方法和访问器装饰器优先于属性装饰器执行。
装饰器在 TypeScript 中的应用场景非常广泛,可以用于日志记录、性能监控、参数验证等,能够帮助开发者在编译阶段进行复杂的操作,同时保持代码的整洁和解耦。