函数装饰器是接收函数并返回新函数的高阶函数，用于扩展功能而不修改原函数。例如logDecorator添加日志，retryDecorator支持配置重试次数，适用于日志、监控等场景。
javaScript 中虽然没有像 python 那样的原生装饰器语法，但可以通过高阶函数模拟实现函数装饰器，用于增强或修改函数行为。这种模式在实际开发中常用于日志记录、性能监控、权限校验等场景。
什么是函数装饰器
函数装饰器本质上是一个函数，它接收另一个函数作为参数，并返回一个新函数。这个新函数通常会扩展原始函数的功能，比如添加前置逻辑、后置逻辑，或改变调用方式。
装饰器不修改原函数代码，而是通过包装实现功能增强，符合“开闭原则”。
基本的装饰器实现方式
使用高阶函数定义装饰器是最常见的方式。以下是一个简单的例子：
function logDecorator(fn) { return function(...args) { console.log(`调用函数: ${fn.name}, 参数:`, args); const result = fn.apply(this, args); console.log(`函数返回值:`, result); return result; }; } // 使用装饰器 function add(a, b) { return a + b; } const loggedAdd = logDecorator(add); loggedAdd(2, 3); // 输出调用和返回信息
在这个例子中，logDecorator 是一个装饰器，它包裹了原函数并添加了日志功能。
带参数的装饰器
有时需要为装饰器传入配置项，可以再封装一层函数：
function retryDecorator(times) { return function (fn) { return function (...args) { let attempts = 0; while (attempts < times) { try { return fn.apply(this, args); } catch (error) { attempts++; if (attempts >= times) throw error; console.log(`重试第 ${attempts} 次...`); } } }; }; } // 使用 const riskyOperation = retryDecorator(3)(function () { if (Math.random() < 0.7) throw new Error("失败！"); return "成功！"; });
这样就能灵活控制重试次数，适用于网络请求等不稳定操作。
利用 es6 proxy 实现更复杂的装饰
对于对象方法的批量装饰，可以用 Proxy 拦截调用过程：
function createLoggedProxy(obj) { return new Proxy(obj, { get(target, prop) { const value = target[prop]; if (typeof value === 'function') { return function (...args) { console.log(`调用方法: ${prop}, 参数:`, args); const result = value.apply(target, args); console.log(`方法返回:`, result); return result; }; } return value; } }); } const api = { fetchUser(id) { return `用户${id}`; } }; const loggedApi = createLoggedProxy(api); loggedApi.fetchUser(123);
这种方式适合对整个对象的方法进行统一增强，无需逐个包装。
基本上就这些。js 函数装饰器虽非语言原生特性，但凭借其灵活性，能有效提升代码复用性和可维护性。关键在于理解高阶函数与闭包机制，合理封装通用逻辑。不复杂但容易忽略细节，比如 this 指向和参数传递要处理得当。