TypeScript中如何引用无需提前实例化泛型的函数类型？

你当前的泛型参数声明位置有误，泛型绑定在了类型别名FetchPageData上，导致使用该类型时必须提前指定泛型具体类型，无法留到函数调用时推导。

修正后的类型定义 #

将泛型参数从类型别名的入参位置，移动到内部的函数签名上，让泛型属于函数本身而非外层类型：

type FetchPageData = <T>(client : APIClient<T>) => T;

const声明写法 #

const fetchPageData: FetchPageData = (client) => {
  // 替换x、y为你的实际参数即可
  return client.getData(x, y);
}

此时调用fetchPageData时，TypeScript会自动根据传入的APIClient实例的泛型类型推导T的类型，无需提前声明。

配合React useCallback的写法 #

直接给useCallback指定泛型为上述FetchPageData类型即可，符合你不用function关键字的要求：

const fetchPageData = useCallback<FetchPageData>((client) => {
  return client.getData(x, y);
}, [/* 填入你的依赖项 */])

两种泛型声明位置的差异 #

• type FetchPageData<T> = (client: APIClient<T>) => T：泛型属于类型别名，使用类型时必须绑定T，生成的函数仅支持固定类型的APIClient
• type FetchPageData = <T>(client: APIClient<T>) => T：泛型属于函数本身，调用函数时才绑定T，同一个函数可支持任意类型的APIClient

内容的提问来源于stack exchange，提问作者Thiago Pereira Maia