如何使用映射类型来映射嵌套泛型类型中的属性子集答案

【问题标题】：How to use mapped types to map a subset of properties in a nested generic type如何使用映射类型来映射嵌套泛型类型中的属性子集
【发布时间】：2021-09-16 11:22:16
【问题描述】：

我有这样的类型：

type Thing = {
  name: string;
  deliveryDate: string;
  stuff: {
    place: string;
    datedContacted: string;
  }
}

我想创建一个具有相同结构的映射类型，如下所示：

type FormThing = {
  name: string;
  deliveryDate: Moment;
  stuff: {
    place: string;
    datedContacted: Moment;
  }
}

我在这里查看 TypeScript 的“映射类型”：https://www.typescriptlang.org/docs/handbook/2/mapped-types.html，但他们的示例似乎主要讨论了如何将一个类型的所有属性转换为另一个，而不是子集。

我试图创建一个像这样的通用类型：

type DateFields = {
  deliveryDate: string;
  dateContacted: string;
}

export type Form<T> = T & {
  [Property in keyof DateFields]: Moment;
};

但它似乎并没有按预期工作。理想情况下，我将其设为通用，因此我可以创建一个类型化方法，该方法可以独立地处理此嵌套对象的任何子级别的转换，从 T 到 Form<T>。

【问题讨论】：

在我看来你让它有点太复杂了，你可以简化事情并直接使用类型而不是尝试映射类型。因为即使您能够实现这一点，也必须将结果传递给函数，这会变得更加复杂。

标签： typescript mapped-types

【解决方案1】：

您可以通过首先将DateFields 更改为字符串文字的并集，然后创建递归映射类型来实现这种深度映射类型

type Thing = {
    name: string;
    deliveryDate: string;
    stuff: {
        place: string;
        dateContacted: string;
    }
}

type DateFields = 'deliveryDate' | 'dateContacted';


type Form<T, Fields> = {
    [K in keyof T]: K extends Fields ? Moment : T[K] extends object ? Form<T[K], Fields> : T[K];
}

在this TypeScript playground查看它

【讨论】：