Typescript装饰器模式,可以有效的提高开发效率,就像Java中使用注解一样,装饰器让TypeScript的世界更友好。 我们使用的许多库都基于这一强大特性构建, 例如Angular和Nestjs。 在这文章中我将介绍装饰器和它的许多细节。 我希望在读完这篇文章后,你可以掌握何时和如何使用这一强大的特性
你可能在前端项目中很少见过注解形式,这是有一定原因的,一方面可能就是见得少,另一个读完文章你就会明白
文章首发公众号,扫码关注获取更多优质内容
概念
装饰器本身就是一种特殊的函数,被用于类的各个属性(类本身、类属性、类方法、类访问器、类方法的参数),装饰器就像高阶函数一样,对目标做了一层中间操作,可以很简洁的无痛修改一些功能和做一些有趣的功能
一个小例子:
// 日志打印(只做代码演示,运行时机有出入)
function logger(key: string): any {
return function () {
console.log("call: ", key);
};
}
class HTTP {
@logger("get")
static get(url?: string) {
return url;
}
}
HTTP.get(); // 打印 call: get
上面简单的演示了调用get
方法时打印logger的功能,只需要在指定的属性前方加上@logger
即可,对原有的业务功能0侵入,这就是装饰器的强大,如果以传统的方式必然会在get内部写一些逻辑