如何使用扩展语法将 TypeScript 类型添加到解构参数中？

Question

忽略这个 add 函数不好的事实。这是一个关于在 TypeScript 中使用数组解构和扩展语法的问题。

这就是我正在尝试的

const add = ([x,...xs]) => {
  if (x === undefined)
    return 0
  else
    return x + add(xs)
}

console.log(add([1,2,3])) //=> 6

但我不知道如何向其中添加 TypeScript 类型。我最好的猜测是做这样的事情（最直接的翻译）

const add = (xs: number[]): number => {
  if (xs[0] === undefined)
    return 0;
  else
    return xs[0] + add(xs.slice(1));
};

console.log(add([1,2,3])); // => 6

这两个函数都有效，但在 TypeScript 中我失去了解构数组参数的能力，函数体被一堆丑陋的东西弄得乱七八糟，比如 xs[0] 和 xs.slice(1) – 即使我将这些抽象成它们自己的功能，这不是重点。

是否可以在 TypeScript 中为解构的传播参数添加类型？

到目前为止我尝试了什么

类似的方法适用于固定数组

// compiles
const add = ([x,y,z]: [number, number, number]): number => ...

但是我当然需要变长数组输入。我试过了，但它没有编译

// does not compile
const add = ([x, ...xs]: [number, number[]]): number => ...

Answer 1

我的错，答案很简单：

const add = ([x, ...xs]: number[]) => {
  if (x === undefined)
    return 0
  else
    return x + add(xs)
}

console.log(add([1, 2, 3])); //=> 6
add(["", 4]); // error

(code in playground)

原回答：

你可以这样做：

const add: (nums: number[]) => number = ([x, ...xs]) => {
    if (x === undefined)
        return 0
    else
        return x + add(xs)
}

您还可以使用类型别名：

type AddFunction = (nums: number[]) => number;

const add: AddFunction = ([x, ...xs]) => {
    ...
}

如何使用扩展语法将 TypeScript 类型添加到解构参数中？

How to add TypeScript types to destructured parameters using spread syntax?

destructuring

typescript

spread-syntax

原回答：