如何为含扩展运算符的数组解构语法添加TypeScript显式类型标注？

嘿，这个问题我之前踩过坑！TypeScript里给数组解构做类型标注，关键要用到带剩余元素的元组类型，而不是你之前尝试的普通元组写法。

正确的写法示例 #

直接给整个解构的数组指定元组类型，其中第一个元素是单个number，剩余部分是number[]，语法上用[number, ...number[]]来定义：

let [first, ...rest]: [number, ...number[]] = [1, 2, 3, 4];

console.log(typeof first); // 输出 number
console.log(typeof rest);  // 输出 object（JS里数组本质是对象类型）
console.log(rest);         // 输出 [2, 3, 4]，类型为 number[]

为啥你之前的写法不生效？ #

你尝试的let [first, ...rest]:[number, object] = [1, 2, 3, 4];有两个核心问题：

1. 长度不匹配：这个元组表示数组只能有两个元素——第一个是number，第二个是object，但你的原数组有4个元素，TypeScript会直接抛出类型不匹配的错误。
2. 类型太宽泛：就算忽略长度问题，object类型也无法准确描述rest是number[]的事实，TypeScript不会自动把宽泛的object推断成具体的数字数组类型。

进阶：用类型别名优化可读性 #

如果这个解构类型要在多处使用，可以封装成类型别名，让代码更整洁：

type LeadingNumberRestArray = [number, ...number[]];

let [first, ...rest]: LeadingNumberRestArray = [1, 2, 3, 4];

这样不管解构多长的数组，first都会被严格限定为number，rest则是number[]，完全符合你的需求～

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