JavaScript装饰器是Stage 3实验特性，通过@符号声明式修改类/方法/属性行为，本质为接收target、key、descriptor等参数的高阶函数，需Babel或TS转译支持。
JavaScript 中的装饰器（Decorator）是一种实验性语法特性，目前处于 Stage 3 提案阶段，尚未被正式纳入 ECMAScript 标准，但已被 TypeScript 和主流构建工具（如 Babel）广泛支持。它提供了一种简洁、声明式的方式来**修改类、类方法、访问器或属性的行为**，而无需侵入原始定义。
装饰器的本质是高阶函数
装饰器本身是一个函数，接收目标对象、成员名、属性描述符等参数，并可返回新的描述符或修改原对象。它通过 @ 符号写在被修饰项上方，语法糖背后是运行时的函数调用。
- 类装饰器：接收
constructor作为唯一参数 - 方法/访问器装饰器：接收
target（原型或构造函数）、propertyKey（方法名）、descriptor（属性描述符） - 属性装饰器（非标准，Babel/TS 支持）：仅接收
target和propertyKey，不能直接拦截赋值（需配合 getter/setter 或初始化逻辑）
启用装饰器需要配置构建工具
原生 JavaScript 引擎不支持装饰器语法，必须借助转译。例如：
- Babel：安装
@babel/plugin-proposal-decorators，并在.babelrc中启用，推荐设置{"legacy": true}以兼容常见库 - TypeScript：在
tsconfig.json中开启"experimentalDecorators": true和"emitDecoratorMetadata": true（后者用于反射元数据）
常用装饰器模式与写法
以下为几个典型实用场景的实现方式（以方法装饰器为例）：
立即学习“Java免费学习笔记（深入）”；
-
日志记录：在方法执行前后打印信息
function log(target, key, descriptor) { const original = descriptor.value; descriptor.value = function(...args) { console.log(`[LOG] ${key} called with`, args); const result = original.apply(this, args); console.log(`[LOG] ${key} returned`, result); return result; }; return descriptor; }class Calculator { @log add(a, b) { return a + b; } }
-
防抖/节流：控制高频方法的执行频率
function debounce(wait) { return function(target, key, descriptor) { const original = descriptor.value; let timeout; descriptor.value = function(...args) { clearTimeout(timeout); timeout = setTimeout(() => original.apply(this, args), wait); }; }; } -
权限检查：运行前校验用户角色
function requireRole(role) { return function(target, key, descriptor) { const original = descriptor.value; descriptor.value = function(...args) { if (!this.user || this.user.role !== role) { throw new Error(`Access denied: ${role} required`); } return original.apply(this, args); }; }; }
类装饰器的实际用途
类装饰器适合做整体增强，比如注册、注入、冻结实例等：
- 自动注册到全局管理器：
function register(name) { return function(constructor) { Registry.register(name, constructor); }; }@register('UserService') class UserService { / ... / }
- 冻结类的 prototype（防止意外修改）：
function sealed(constructor) { Object.seal(constructor); Object.seal(constructor.prototype); }
装饰器不是黑魔法，它依赖于 JavaScript 的元编程能力（如 Object.defineProperty），理解其参数和返回值机制是正确使用的关键。实际项目中建议优先选用成熟库（如 core-decorators）或封装内部统一装饰器规范，避免过度抽象导致可读性下降。
