对象解构中的类型

This

const { foo: IFoo[] } = bar;

这

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

会合理地引起错误。

这

const { foo: TFoo } = bar;

将会解构TFoo属性。

如何为解构对象属性指定类型?

当前回答

当你使用多个变量时，它很方便，如果函数返回类型是类型的，解构结构是类型的，不需要定义一个单独的返回类型:

function getBananaDetail<detailType>(...args): { name: string, detail: detailType } {
//...
}
const { name, detail } = getBanana<number>()

其他回答

接下来是我自己的问题。

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

考虑到bar被正确输入，foo type将被推断出来:

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[]

如果你想要析构函数和重命名

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

我花了一点时间才弄清楚上面的问题

事实证明，对于整个解构模式，可以在:之后指定类型:

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

哪一个在现实中不比普通的好呢

const foo: IFoo[] = bar.foo;

我显然来晚了一点，但是:

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

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

属性名称和年龄的类型应该分别正确地推断为字符串和数字。

当你使用多个变量时，它很方便，如果函数返回类型是类型的，解构结构是类型的，不需要定义一个单独的返回类型:

function getBananaDetail<detailType>(...args): { name: string, detail: detailType } {
//...
}
const { name, detail } = getBanana<number>()

推荐文章