TypeScript如何定义各子数组内部元素类型一致的二维数组类型

核心实现代码 #

我们可以通过泛型映射类型加工具函数的方式完成约束，无需手动标注类型即可自动校验：

// 工具类型：约束单个数组内部所有元素类型相同
type UniformArray<T> = T extends (infer U)[] ? U[] : never

// 工具类型：约束二维数组的每个子数组内部元素类型相同
type Uniform2D<T extends unknown[]> = {
  [K in keyof T]: UniformArray<T[K]>
}

// 工具函数：自动推导泛型，无需手动标注类型即可完成校验
function defineUniform2D<T extends unknown[]>(arr: Uniform2D<T>) {
  return arr
}

使用示例 #

合法场景（校验通过） #

// 自动校验通过，无需手动写泛型参数
const validArr = defineUniform2D([
  ['foo', 'bar'],
  [null, null],
  [1, 2]
])

非法场景（校验报错） #

// 直接触发类型错误：第一个子数组同时存在 number 和 string 类型，第二个子数组同时存在 boolean 和 undefined 类型
const invalidArr = defineUniform2D([
  [1, 'foo'],
  [true, undefined]
])

原理解释 #

• UniformArray 类型会提取输入数组的元素类型，强制要求数组所有元素匹配该类型
• Uniform2D 为映射类型，会遍历外层数组的每一个子项，对每个子数组单独施加同类型约束
• defineUniform2D 利用 TypeScript 自动泛型推导能力，省去手动标注每个子数组类型的成本，直接对输入值做校验

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