如何获取数组类型值的类型？

Question

如果我有类型type foo = Array<{ name: string; test: number; }>，是否可以获取数组中的值类型，在本例中为接口。我知道有keyof来获取密钥，值是否有类似值？

Answer 1

如果您正在查看如何提取{ name: string; test: number; }类型，则可以在索引＆＃34;

创建＆＃34;项目的别名：

type Foo = Array<{ name: string; test: number; }>;
type FooItem = Foo[0];

Answer 2

从TypeScript 2.8开始，您也可以使用infer关键字

执行此操作

type GetElementType<T extends Array<any>> = T extends (infer U)[] ? U : never;

例如，使用映射类型：

type MapArraysToValues<T extends { [key: string]: any[] }> = {
    [key in keyof T]: GetElementType<T[key]>;
}

// The type of Output is { x: number, y: string }
type Output = MapArraysToValues<{ x: number[], y: string[] }>;

Answer 3

尽管Aleksey回答，但知道如果该泛型类型的实例至少暴露了一个您想要提取的类型的成员，则可以使用typeof到query the type构件。

对于通用Array，可以从任何数组项查询类型：

请注意，第27行仅在设计时存在，因此即使arr在运行时为空或未定义，也不会生成任何错误。

Answer 4

我们还可以像这样使用索引访问运算符：

const someArray = [
    {
        foo: '',
        bar: '',
        baz: ''
    },
    {
        foo: '',
        bar: '',
        baz: ''
    }
];

// indexed access operator
type SomeArray = typeof someArray[number];

这里有关于这些内容的文章：https://www.typescriptlang.org/docs/handbook/advanced-types.html

  

第二个运算符是T [K]，索引访问运算符。

Answer 5

使用流行的utility-types库：

type foo = Array<{ name: string; test: number; }>

type fooElements = ValuesType<foo>
// = { name: string; test: number; }

请参见https://www.npmjs.com/package/utility-types#valuestypet

Answer 6

您可以使用括号简单地获取数组的类型，如下所示：

type foo = Array<{ name: string; test: number; }>
const bar: foo[number] = {name:"", test:42};

奖励：

如果您的数组是元组（其中元素按索引键入），您可以使用类型括号内的索引指定要定位的类型。

type foo = [number, string, ...number[]]; // a tuple or typed array
const barA: foo[0] = 42;
const barB: foo[1] = 'hello';
const barC: foo[2] = 256;
// Using type[number] will generate an union of all the possible types.
// Here below string | number. The following is therefore valid
const barStringOrArray: foo[number] = Math.random() < 0.5 ? 42 : 'hello';