文章目录
一、装饰器基本概念
装饰器是 TypeScript 中一种特殊的语法特性,它本质上是一个函数,能够附加到类、类的方法或者类的属性上,用于对它们进行额外的修饰和扩展,在不改变原有类、方法或属性的基本定义和逻辑的基础上,添加一些额外的功能或改变其行为。可以把装饰器看作是一种 “包装器”,通过它能够以一种简洁且声明式的方式为代码注入更多的功能和逻辑,增强代码的可复用性和灵活性。
二、装饰器的语法(函数形式)
装饰器使用 @ 符号加上装饰器函数名的形式来应用到对应的代码元素上,其基本语法如下:
(一)类装饰器
类装饰器是应用在类声明之前,语法格式为:
@decoratorFunction
class MyClass {
// 类的定义
}
这里的 decoratorFunction 就是一个作为类装饰器的函数,它接收类的构造函数作为参数,例如:
function simpleClassDecorator(constructor: Function) {
console.log("类装饰器被调用了");
constructor.prototype.newProperty = "这是装饰器添加的新属性";
}
@simpleClassDecorator
class MyClass {
// 类的原始定义
}
const myInstance = new MyClass();
console.log(myInstance.newProperty); // 输出 "这是装饰器添加的新属性"
(二)方法装饰器
方法装饰器应用于类中的方法声明之前,语法形式如下:
class MyClass {
@methodDecoratorFunction
myMethod() {
// 方法的逻辑
}
}
方法装饰器函数接收三个参数,分别是类的构造函数、方法名以及方法的属性描述符,例如:
function logMethodCall(constructor: Function, methodName: string, descriptor: PropertyDescriptor) {
const originalMethod = descriptor.value;
descriptor.value = function (...args: any[