在 TypeScript 中,装饰器 (Decorators) 是一种特殊类型的声明,它可以被附加到类声明,方法,访问符,属性或参数上。装饰器使用 @expression
这样的形式,其中 expression
必须计算为一个函数,它将在运行时被调用,装饰器的行为可以通过这个函数的返回值来修改。
以下是如何在 TypeScript 中创建和使用装饰器的基本步骤:
步骤 1: 首先,确保在 tsconfig.json
文件中启用了装饰器。将 "experimentalDecorators": true
添加到编译选项。
{"compilerOptions": {"target": "es5","experimentalDecorators": true}
}
步骤 2: 创建一个装饰器。装饰器是一个函数,它接受三个参数:目标对象,属性名(对于静态成员来说是 undefined)和属性描述符(对于静态成员来说是 undefined)。以下是一个简单的装饰器示例:
function sealed(target: Function) {Object.seal(target);Object.seal(target.prototype);
}
步骤 3: 使用装饰器。你可以通过在声明之前添加 @
符号和装饰器的名称来使用装饰器。以下是如何使用上面创建的 sealed
装饰器的示例:
@sealed
class Greeter {greeting: string;constructor(message: string) {this.greeting = message;}greet() {return "Hello, " + this.greeting;}
}
在这个例子中,@sealed
装饰器被应用到 Greeter
类。当这个类被创建时,sealed
函数将被调用,Greeter
类和它的原型将被密封,这意味着你不能再向它们添加新的属性。
你也可以创建更复杂的装饰器,例如参数装饰器,方法装饰器或属性装饰器。这些装饰器可以用于执行更复杂的任务,如验证输入参数,修改方法的行为,或动态地添加属性。以下是一个方法装饰器的示例:
function enumerable(value: boolean) {return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {descriptor.enumerable = value;};
}class Greeter {greeting: string;constructor(message: string) {this.greeting = message;}@enumerable(false)greet() {return "Hello, " + this.greeting;}
}
在这个例子中,@enumerable(false)
装饰器被应用到 greet
方法。这个装饰器将修改 greet
方法的属性描述符,使其不可枚举。