TypeScript二维数组使用扩展运算符时出现类型错误问题求解

错误原因 #

这个报错是TypeScript的默认类型推断规则导致的：

1. 未显式标注类型的数组字面量，TypeScript会默认推断为长度可变的普通数组类型，而不是定长的元组类型。比如['a', 'b']会被推断为string[]，而非[string, string]。
2. 你声明的[string, string][]是元组数组类型，要求每一项都必须是长度为2的字符串数组。普通string[][]类型的子元素长度不固定，不符合类型约束，因此会抛出不兼容错误。
3. Array.map的返回值默认也会被推断为普通数组类型，所以你实际使用场景中的写法也会触发同样的报错。

最优解决方案 #

1. 给map指定泛型参数（实际场景首选） #

直接在调用map时显式指定返回元素的类型，不需要类型断言，也不需要额外加readonly修饰符，可读性最高，完全符合类型安全要求：

const someValues = [1, 2, 3];

const test3: [string, string][] = [
  ...someValues.map<[string, string]>(value => ['some string', 'another string']),
];

2. 给被展开的数组显式标注类型（基础场景适用） #

如果是直接展开数组字面量的场景，可以直接给被展开的对象标注类型：

const test2: [string, string][] = [
  ...([['a', 'b'], ['c', 'd']] as [string, string][]),
];

3. 封装通用工具函数（高频使用场景适用） #

如果项目中经常需要返回二元组的场景，可以封装一个简单的工具函数，使用时不需要写任何类型标注，语义化更强：

function createStringPair(a: string, b: string): [string, string] {
  return [a, b];
}

// 使用示例
const someValues = [1, 2, 3];
const test3: [string, string][] = [
  ...someValues.map(value => createStringPair('some string', 'another string')),
];

内容的提问来源于stack exchange，提问作者Zed-K