对象解构中的类型

Question

这个

const { foo: IFoo[] } = bar;

还有这个

const { foo: Array<IFoo> } = bar;

会合理地导致错误.

还有这个

const { foo: TFoo } = bar;

将只是破坏TFoo财产.

如何为析构化对象属性指定类型？

Answer 1

事实证明,可以:为整个解构模式指定类型:

const {foo}: {foo: IFoo[]} = bar;

实际上,这并不比普通老年人好

const foo: IFoo[] = bar.foo;

Answer 2

我显然有点迟到了,但是:

interface User {
  name: string;
  age: number;
}

const obj: any = { name: 'Johnny', age: 25 };
const { name, age }: User = obj;

该类型的属性name和age应正确推断string和number分别.

Answer 3

我自己的问题的后续。

不需要为对象属性指定类型，因为它们是从解构的对象中推断出来的。

考虑到bar输入正确，foo将推断类型：

const bar = { foo: [fooValue], ... }; // bar type is { foo: IFoo[], ... }
...
const { foo } = bar; // foo type is IFoo[]

即使bar未正确键入（any或unknown），也可以断言其类型：

const { foo } = bar as { foo: IFoo[] }; // foo type is IFoo[]

Answer 4

NextJS 打字稿示例

我有这样的场景：

const { _id } = req.query
if (_id.substr(2)) { 
 ...
}

其中的req.query类型是

type ParsedUrlQuery = { [key: string]: string | string[] }

所以这样做有效：

const { _id } = req.query as { _id: string }
if (_id.substr(2)) { 
 ...
}

具有讽刺意味的是，Typescript 是正确的，我应该这样做：

const _id = (req.query._id || '').toString() ? 

或者制作一些像这样的辅助方法：

const qs = (
  (q: ParsedUrlQuery) => (k: string) => (q[k] || '').toString()
)(req.query) 

我可以像这样重用：

const _id = qs('_id') 

Answer 5

如果你想析构并重命名：

const {foo: food}: {foo: IFoo[]} = bar;

我花了一秒钟才把上面的内容弄对。