装饰器是用于扩展类、方法等行为的函数,通过@语法应用,可在运行时修改目标逻辑,常用于日志、权限控制、性能监控等场景,提升代码复用性与可读性。

装饰器(Decorators)是一种特殊类型的声明,可以被附加到类声明、方法、访问器、属性或参数上。它们使用 @expression 的形式,其中 expression 求值后必须是一个函数,该函数会在运行时被调用,传入被装饰的声明信息。
装饰器如何工作
装饰器本质上是一个函数,通过在目标(如类、方法、属性)前使用 @ 符号来应用。这个函数接收特定参数,根据装饰的位置不同而有所变化:
类装饰器:接收类的构造函数作为唯一参数。方法/访问器装饰器:接收类的原型、成员名称和属性描述符。属性装饰器:接收类的原型和成员名称。参数装饰器:接收类的原型、成员名称和参数在参数列表中的索引。
装饰器函数可以返回一个新的描述符对象或修改现有行为,从而实现对原定义的扩展或替换。
注意:JavaScript 原生尚未正式支持装饰器,但 TypeScript 和 Babel 等工具已提供实验性支持。目前 TC39 正在推进装饰器提案(Stage 3),语法与早期版本有较大差异。
立即学习“Java免费学习笔记(深入)”;
实际应用场景
装饰器在开发中能显著提升代码可读性和复用性,尤其适合处理横切关注点(cross-cutting concerns)。
日志记录(Logging)
通过方法装饰器自动记录函数调用情况:
function log(target, name, descriptor) { const original = descriptor.value; descriptor.value = function (...args) { console.log(`Calling "${name}" with`, args); return original.apply(this, args); }; return descriptor;}class Calculator {@logadd(a, b) {return a + b;}}
调用 add 方法时会自动输出日志,无需在方法内部手动添加。
权限控制与验证
用于限制某些方法的访问权限或校验输入:
function requireAdmin(target, name, descriptor) { const original = descriptor.value; descriptor.value = function (...args) { if (!this.isAdmin) { throw new Error("Access denied"); } return original.apply(this, args); }; return descriptor;}
适用于管理系统中对敏感操作进行保护。
性能监控
测量方法执行时间:
function measure(target, name, descriptor) { const original = descriptor.value; descriptor.value = function (...args) { const start = performance.now(); const result = original.apply(this, args); const end = performance.now(); console.log(`${name} took ${end - start}ms`); return result; }; return descriptor;}
自动绑定 this(React 中常见)
避免手动绑定事件处理器:
function bind(target, name, descriptor) { const original = descriptor.value; descriptor.value = function (...args) { return original.apply(target.prototype, args); }; return descriptor;}
注意事项
装饰器是实验性功能,在生产环境中使用需谨慎。TypeScript 需启用 experimentalDecorators 编译选项。新标准装饰器语法与旧版不兼容,建议关注官方进展。
基本上就这些。合理使用装饰器能让代码更简洁,但过度使用可能导致逻辑分散、调试困难。保持适度,优先确保可维护性。
以上就是JavaScript中的装饰器(Decorators)如何工作,有哪些实际应用?的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1523696.html
微信扫一扫
支付宝扫一扫