【问题标题】:How to add TypeScript types to destructured parameters using spread syntax?如何使用扩展语法将 TypeScript 类型添加到解构参数?
【发布时间】:2017-07-08 09:32:48
【问题描述】:

忽略这是不好的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 => ...

【问题讨论】:

  • 理论上你所说的应该使用扩展运算符来工作......basarat.gitbooks.io/typescript/content/docs/…。哦,你想添加类型......我刚刚阅读了剩下的内容
  • 是的,我也发现了这一点——我对 TypeScript 的了解不够,但我认为那本书里有一个非常奇怪的页面。我的意思是,如果你不能将它们与 types ... 一起使用,谁会关心 TypeScript 中的这些功能
  • 我认为传播不支持这一点。如果数组是固定长度的,你可以这样做:[x, y, z]: [number, number, number] 但就是这样:(
  • 是的,我尝试了类似的方法。我会更新我的问题,以帮助可能以类似方式浪费时间的人。

标签: typescript destructuring spread-syntax


【解决方案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]) => {
    ...
}

【讨论】:

  • guh... so 太尴尬了——尤其是因为我们必须为类型提供一个名称(在本例中为 nums)。这太违反直觉了,因为nums 是一个实际上在add 范围内不可用的标识符。 TypeScript forces you to specify identifiers that aren't usable 一直困扰着我。无论如何,感谢您为此提供解决方案。 -1 为 TypeScript,+1 为你。
  • 好吧,我没有完全理解你。检查我修改后的答案。
  • 好的,兑换1号!多谢了。我很高兴让您查看其他问题,让我知道是否有兑换编号 2 ^_^
猜你喜欢
  • 2016-07-01
  • 2021-07-24
  • 1970-01-01
  • 2019-02-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多