如何创建带额外参数的类型安全函数包装器？

你的代码思路方向是对的，但存在TypeScript语法和逻辑错误，导致无法正常运行且无法保证类型安全，具体问题如下：

• 参数类型写法错误：(TFunc func) 不符合TypeScript语法规范，正确的参数类型声明应该是 (func: TFunc)，遵循「参数名: 类型」的格式。
• 原函数参数传递错误：Parameters<TFunc> 返回的是原函数参数的元组类型，直接把这个元组传给func会导致参数不匹配，必须用扩展运算符...innerParams解构元组后传递。
• 泛型缺少约束：没有给TFunc添加函数类型约束，TypeScript无法正确推断Parameters<TFunc>和ReturnType<TFunc>的类型，会出现类型报错。

修正后的可行实现 #

下面是修复后的代码，同时优化了包装函数的调用体验（让额外参数直接跟在原函数参数后面，无需打包成数组）：

// 示例：假设modifyInnerResultWithExtraParams是这样的处理函数
function modifyInnerResultWithExtraParams<T>(result: T, num: number, str: string): T & { extra1: number; extra2: string } {
  return { ...result, extra1: num, extra2: str };
}

function createWrapper<TFunc extends (...args: any[]) => any>(func: TFunc) {
  return (...args: [...Parameters<TFunc>, extraParam1: number, extraParam2: string]) => {
    // 拆分原函数参数和额外参数
    const innerParams = args.slice(0, -2) as Parameters<TFunc>;
    const [extra1, extra2] = args.slice(-2) as [number, string];
    
    const innerResult = func(...innerParams);
    return modifyInnerResultWithExtraParams(innerResult, extra1, extra2);
  };
}

// 测试用例
const originalFunc = (a: number, b: string) => ({ value: a + b.length });
const wrappedFunc = createWrapper(originalFunc);

// 调用时会自动提示参数类型，类型不匹配会报错
const result = wrappedFunc(10, "hello", 20, "world");
// result的类型会被正确推断为 { value: number } & { extra1: number; extra2: string }

类型安全说明 #

修正后的代码通过以下方式保证类型安全：

• 给TFunc添加extends (...args: any[]) => any约束，确保传入的参数必须是函数类型。
• 使用Parameters<TFunc>获取原函数的参数类型，结合剩余参数语法让包装函数的参数类型自动对齐原函数参数+额外参数。
• 返回值类型基于原函数的返回值类型扩展，TypeScript会自动推断最终返回值的结构。

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