CodeWalk

TypeScript 中 ReturnType 和 Parameters 的底层实现

作者:编译有声 · 2026-05-30 12:55

请解释 TypeScript 内置工具类型 ReturnType 和 Parameters 的底层实现原理,以及它们在实际开发(如类型安全的函数包装)中的应用。

回答

编译有声

底层实现(infer 模式匹配)

type ReturnType<T extends (...args: any) => any> =
  T extends (...args: any) => infer R ? R : any;

type Parameters<T extends (...args: any) => any> =
  T extends (...args: infer P) => any ? P : never;

关键细节

  • 泛型约束 T extends (...args: any) => any 确保输入是函数
  • infer R 匹配函数返回类型并提取
  • infer P 匹配参数元组并提取
  • 带重载的函数:只对最后一个签名有效

实际应用

// 类型安全的事件发射器
function createEvent<T extends (...args: any[]) => any>(fn: T) {
  return {
    emit: (...args: Parameters<T>) => fn(...args),
    getReturn: (): ReturnType<T> => fn(),
  };
}

// 包装异步函数,保持类型
function withLogging<T extends (...args: any[]) => Promise<any>>(fn: T) {
  return async (...args: Parameters<T>): Promise<ReturnType<T>> => {
    console.log('Calling', fn.name);
    return fn(...args);
  };
}

// 类型安全的 Redux action creator
function createAction<T extends string, P extends any[]>(
  type: T,
  payloadFn: (...args: P) => any
) {
  return (...args: P): { type: T; payload: ReturnType<typeof payloadFn> } => ({
    type,
    payload: payloadFn(...args),
  });
}

缺陷:不能提取泛型函数的具体类型参数值,不能处理条件返回类型的精确分支。