在 Typescript 映射类型中更改属性名称 [英] Changing Property Name in Typescript Mapped Type

问题描述

我有一组 Typescript 对象，如下所示:

I have a collection of Typescript objects that look like this:

SomeData {
  prop1: string;
  prop2: number;
}

我需要得到一些看起来像这样的对象:

And I need to end up with some objects that look like this:

type SomeMoreData= {
  prop1Change: string;
  prop2Change: number;
}

我知道如果我只是想改变类型，我可以这样做:

I know that if I just wanted to change the type, I could do this:

type SomeMoreData<T> = {
  [P in keyof T]: boolean;
}

哪个会给我:

SomeMoreData<SomeData> {
  prop1: boolean;
  prop2: boolean;
}

有没有办法操作由 [P in keyof T] 位生成的名称?我尝试过诸如 [(P in keyof T) + "Change"] 之类的东西，但没有成功.

Is there a way to manipulate the name produced by the [P in keyof T] bit? I've tried things like [(P in keyof T) + "Change"] with no success.

推荐答案

映射类型中的键重映射是 在 typescript 4.1 中引入:

Key remapping in Mapped Types was introduced in typescript 4.1:

type SomeData = {
    prop1: string;
    prop2: number;
}

type WithChange<T> = { [P in keyof T & string as `${P}Change`]: T[P] };

type SomeMoreData = WithChange<SomeData>; // {  prop1Change: string, prop2Change: number }

游乐场

在上面的示例中，我们使用了两个新功能:映射类型中的 as 子句 + 模板文字类型.

In above example we use two new features: as clause in mapped types + template literal type.

模板字符串类型是模板字符串表达式的类型空间等价物.与模板字符串表达式类似，模板字符串类型包含在反引号分隔符中，并且可以包含 ${T} 形式的占位符，其中 T 是一种可分配给 string、number、boolean 或 bigint.模板字符串类型提供了连接文字字符串、将非字符串原始类型的文字转换为其字符串表示形式以及更改字符串文字的大小写或大小写的能力.此外，通过类型推断，模板字符串类型提供了一种简单的字符串模式匹配和分解形式.

Template string types are the type space equivalent of template string expressions. Similar to template string expressions, template string types are enclosed in backtick delimiters and can contain placeholders of the form ${T}, where T is a type that is assignable to string, number, boolean, or bigint. Template string types provide the ability to concatenate literal strings, convert literals of non-string primitive types to their string representation, and change the capitalization or casing of string literals. Furthermore, through type inference, template string types provide a simple form of string pattern matching and decomposition.

一些例子:

type EventName<T extends string> = `${T}Changed`;
type Concat<S1 extends string, S2 extends string> = `${S1}${S2}`;
type T0 = EventName<'foo'>;  // 'fooChanged'
type T1 = EventName<'foo' | 'bar' | 'baz'>;  // 'fooChanged' | 'barChanged' | 'bazChanged'
type T2 = Concat<'Hello', 'World'>;  // 'HelloWorld'
type T3 = `${'top' | 'bottom'}-${'left' | 'right'}`;  // 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'

附加映射类型支持可选的 as 子句，通过该子句可以指定生成的属性名称的转换:

Additionally mapped types support an optional as clause through which a transformation of the generated property names can be specified:

{ [P in K as N]: X }

其中 N 必须是可分配给 string 的类型.

where N must be a type that is assignable to string.

这篇关于在 Typescript 映射类型中更改属性名称的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！