使用重命名和键入信息解构赋值

Question

如何在保持输入信息的同时将变量解构为新名称？

renderItem({item:'apple'})

// jsx:
function renderItem({item: region}) {
    // region == 'apple'
    return <div>{region}</div>;
}

以上将使用 item 解构一个对象并将其分配给region.

如何表达此函数签名的键入信息？

Answer 1

像这样输入传入的项目：

function renderItem({item: region}:{item:string}){}

Answer 2

有关该功能的类型化的信息可在 TypeScript 2.1 文档中找到：

\n\n

\n

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.html

\n\n

对象休息是对象扩展的双重功能，因为它们可以提取在解构元素时不会获取的任何额外属性：

\n

\n\n

当使用该功能的其余部分时，它使我们能够将其余属性收集到由它们组成的新对象中，从而增强对象解构。

\n\n

我们可以像编写任何其他值一样编写类型注释。这是首选，因为它可以阻止您的函数签名变得冗长例如

\n\n

interface IRenderItem {\n  item: String\n}\n\nfunction renderItem({ item: region }: IRenderItem): void {\n  console.log(item);\n}\n

\n