浏览 76
扫码
装饰器(Decorators)是一种特殊类型的声明,可以附加到类声明、方法、访问器、属性或参数上,来修饰这些声明。装饰器使用@expression
这种语法,expression
必须求值为一个函数,然后被应用到被修饰的声明上。装饰器是一种实验性特性,需要开启experimentalDecorators
编译选项。
装饰器提供了一种更加灵活和可重用的方式来修改或扩展类的行为。在TypeScript中,装饰器可以分为类装饰器、方法装饰器、访问器装饰器、属性装饰器和参数装饰器。
类装饰器
类装饰器在类声明之前声明,用来修饰类的构造函数。类装饰器接收一个参数,即被修饰的类的构造函数。
function classDecorator(constructor: Function) {
console.log('Class Decorator');
}
@classDecorator
class MyClass {
constructor() {
console.log('Class Constructor');
}
}
方法装饰器
方法装饰器用来修饰类的方法,可以拦截该方法的调用。方法装饰器接收三个参数,分别是目标对象、方法名和方法描述符。
function methodDecorator(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
console.log('Method Decorator');
}
class MyClass {
@methodDecorator
myMethod() {
console.log('My Method');
}
}
访问器装饰器
访问器装饰器用来修饰类的访问器(getter和setter)。访问器装饰器接收三个参数,分别是目标对象、属性名和属性描述符。
function accessorDecorator(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
console.log('Accessor Decorator');
}
class MyClass {
private _value: number = 0;
@accessorDecorator
get value(): number {
return this._value;
}
set value(value: number) {
this._value = value;
}
}
属性装饰器
属性装饰器用来修饰类的属性。属性装饰器接收两个参数,分别是目标对象和属性名。
function propertyDecorator(target: any, propertyKey: string) {
console.log('Property Decorator');
}
class MyClass {
@propertyDecorator
myProperty: string = 'My Property';
}
参数装饰器
参数装饰器用来修饰类的构造函数参数或方法参数。参数装饰器接收三个参数,分别是目标对象、方法名或undefined(如果修饰的是构造函数参数)和参数在参数列表中的索引。
function parameterDecorator(target: any, propertyKey: string | symbol, parameterIndex: number) {
console.log('Parameter Decorator');
}
class MyClass {
myMethod(@parameterDecorator param1: string, @parameterDecorator param2: number) {
console.log('My Method');
}
}
以上是关于Typescript装饰器的基础教程,希望对你有所帮助。如果想更深入了解装饰器的用法和应用场景,可以查阅官方文档或相关教程。