TypeScript 以下两种泛型类型声明写法的区别是什么？

二者的核心差异是泛型参数的绑定时机不同，对应使用场景完全不一样： #

写法1：泛型参数绑定到函数调用时机 #

type CallbackBaseAsyncFuntion = <T>(callback: (response: ApiResponse<T>) => void) => void;

• 这里的<T>属于函数自身的入参，泛型的具体类型要等到实际调用该函数的时候才会被推导或者手动指定
• 同一个函数实例可以在多次调用时传入不同的泛型类型，适配不同的返回值结构
• 适用场景：函数本身是通用请求工具，每次调用可以返回不同类型的结果
  示例用法：

  // 声明通用请求工具
  const request: CallbackBaseAsyncFuntion = (callback) => { /* 通用请求逻辑 */ }
  // 调用时指定返回User类型
  request<User>(res => { console.log(res.data.nickname) })
  // 同一个工具调用时指定返回Order类型
  request<Order>(res => { console.log(res.data.orderId) })
  

写法2：泛型参数绑定到类型声明时机 #

type CallbackBaseAsyncFuntion<T> = (callback: (response: ApiResponse<T>) => void) => void;

• 这里的<T>属于type别名的入参，泛型的具体类型在声明对应类型的变量时就必须固定
• 该函数实例后续所有调用的返回值类型都是固定的，不能再修改
• 适用场景：函数从定义开始就固定只返回某一类结构的数据，不需要适配多种类型
  示例用法：

  // 声明变量时就固定只能返回User类型
  const fetchUserInfo: CallbackBaseAsyncFuntion<User> = (callback) => { /* 获取用户信息的固定逻辑 */ }
  // 调用时不需要再指定类型，callback入参默认就是ApiResponse<User>
  fetchUserInfo(res => { console.log(res.data.nickname) })
  

内容的提问来源于stack exchange，提问作者x-bird