能否创建自定义函数初始化器？实现函数调用前后执行附加代码

你提到的两种语法形式在JavaScript中是原生不支持的，但可以通过高阶函数或装饰器实现你想要的「调用函数前后自动执行特定代码」的效果，以下是具体实现：

方案一：高阶函数（原生JS兼容） #

这是最通用的方案，不需要额外工具支持。我们可以写一个customFunction高阶函数，它接收目标函数作为参数，返回一个包裹了前置/后置逻辑的新函数：

// 定义自定义初始化器
function customFunction(targetFunc) {
  return function(...args) {
    // 执行前置代码
    console.log("Starting customFunction");
    // 调用原函数，保留上下文和参数
    const result = targetFunc.apply(this, args);
    // 执行后置代码
    console.log("Ending customFunction");
    // 返回原函数的执行结果
    return result;
  };
}

// 创建带包裹逻辑的新函数
const newFunction = customFunction(function() {
  console.log("这是newFunction的核心业务代码");
  return "函数执行完成";
});

// 调用测试
const result = newFunction();
console.log(result); // 输出：函数执行完成

方案二：装饰器语法（接近你想要的语法形式） #

如果你想更贴近customFunction newFunction()的写法，可以使用ES装饰器语法（需要Babel或TypeScript编译支持）：

// 定义装饰器
function customFunction(target, propertyKey, descriptor) {
  const originalFunc = descriptor.value;
  descriptor.value = function(...args) {
    console.log("Starting customFunction");
    const result = originalFunc.apply(this, args);
    console.log("Ending customFunction");
    return result;
  };
  return descriptor;
}

// 使用装饰器标记函数
class Demo {
  @customFunction
  newFunction() {
    console.log("这是newFunction的核心业务代码");
    return "类方法执行完成";
  }
}

// 调用测试
const demo = new Demo();
demo.newFunction();

关键说明 #

• 两种方案都能完整保留原函数的参数、上下文和返回值，不会破坏原有逻辑。
• 高阶函数方案兼容性最好，所有现代浏览器和Node.js环境都支持。
• 装饰器语法更符合你设想的语法风格，但需要配置编译工具，属于ES提案阶段的特性（目前已进入Stage 3，接近正式标准）。

内容的提问来源于stack exchange，提问作者Eksperiment626