给定 TypeScript 中数组的类型，获取数组元素的类型答案

【问题标题】：Getting type of array elements given the type of the array in TypeScript给定 TypeScript 中数组的类型，获取数组元素的类型
【发布时间】：2020-05-07 08:57:04
【问题描述】：

我正在使用 TypeScript 编写一个泛型函数，但我找不到在给定数组类型的情况下提取数组元素类型的方法。假设我有一些这样的数据：

interface Store {
    posts: Post[]
    users: User[]
}

const store: Store = {
    posts: [post0, post1, post2],
    users: []
}

我的函数接受这些数组并对它们做一些事情，假设当里面有东西时返回第一个元素。

function process<T>(storeItem: T[]): T | null {
    if (storeItem) return storeItem[0]
    return null
}

现在我想创建一个新函数，将该函数依次应用于所有商店项目并创建一个新对象。这个函数看起来像

const processed = Object.keys(store).reduce((accum, el) => {...accum, process(store[el])}, {})

现在我想将结果对象processed的类型定义为

type Processed<Store> = {
    [K in keyof Store]: ArrayElement<Store[K]> | null
}

然而，我找不到一种方法来提取给定数组类型的数组元素的类型，即等同于 ArrayElement 的东西（这是我编造的）。我该如何解决这个问题？

【问题讨论】：

"但是我的函数的调用者也是通用的"你能展示那部分吗？因为我很确定process<T>(data: T[]): T 已经是你需要的了。
其实你是对的，我只是把自己弄糊涂了。
@AlexWayne 嗯，我认为我仍然无法解决我的问题，并且我给出的简化示例没有正确解决它。我重新提出了我的问题，以更好地代表我的实际问题。你能再看看我修改过的问题吗？谢谢！

标签： typescript

【解决方案1】：

我在高级类型示例中找到了解决方案here。

type Unpacked<T> =
    T extends (infer U)[] ? U :
    T extends (...args: any[]) => infer U ? U :
    T extends Promise<infer U> ? U :
    T;

type T0 = Unpacked<string>;  // string
type T1 = Unpacked<string[]>;  // string
type T2 = Unpacked<() => string>;  // string
type T3 = Unpacked<Promise<string>>;  // string
type T4 = Unpacked<Promise<string>[]>;  // Promise<string>
type T5 = Unpacked<Unpacked<Promise<string>[]>>;  // string

因此，对于我的情况，最简单的解决方案是将我的 ArrayElement 类型定义为：

type ArrayElement<T> = T extends (infer U)[] ? U : null

【讨论】：