TypeScript声明泛型Item数组时如何让各元素泛型参数正确推断？

实现方案 #

你可以通过可变元组泛型让 TypeScript 单独推导数组中每个 Item 的泛型参数，无需统一所有元素的泛型类型，代码如下：

type Item<T> = {
  value: T; 
  fn: (value: T) => void; 
}

// 核心：泛型约束为Item<any>数组，参数用剩余元组语法触发逐元素类型推断
function usesItems<T extends Item<any>[]>(items: [...T]) {
  // 函数内部逻辑
}

效果验证 #

调用时每个元素的fn参数都会被正确推断为对应类型，支持不同泛型的Item共存：

usesItems([
  {
    value: 999,
    fn: (value) => {
      // value 自动推断为 number 类型
    }
  },
  {
    value: "aaa",
    fn: (value) => {
      // value 自动推断为 string 类型
    }
  },
  {
    value: false,
    fn: (value) => {
      // value 自动推断为 boolean 类型
    }
  }
])

原理说明 #

• 语法[...T]会告诉 TypeScript 不要将传入的数组统一推导为联合类型数组，而是将其作为元组逐个处理每个位置的元素
• 每个元素的泛型会单独推导，不会互相影响
• 如果你使用 TypeScript 5.0 及以上版本，也可以加上const泛型获得更严格的类型推断：

function usesItems<const T extends Item<any>[]>(items: [...T]) {
  // 内部逻辑
}

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