TypeScript中如何将属性类型设为类型名的可文本化表示？

首先核心结论：TypeScript 的类型是编译期擦除的结构化类型，没有原生能力直接从传入的 class/interface 类型本身提取其定义的名称字符串，你需要手动传入类型名称的字符串字面量来实现需求。

需求1：生成属性名为类型名的对象类型 #

实现代码：

// T 是类型名字面量，V 是属性值类型，可自行替换默认值
type DynamicPropertyName<T extends string, V = any> = {
  [K in T]: V
}

// 使用示例
type WithPropFoo = DynamicPropertyName<'Foo'> // 类型为 { Foo: any }
type WithPropBar = DynamicPropertyName<'Bar', number> // 类型为 { Bar: number }

需求2：生成type字段为类型名字面量的对象类型 #

实现代码：

type DynamicPropertyName<T extends string> = {
  type: T
}

// 使用示例
type WithPropFoo = DynamicPropertyName<'Foo'> // 类型为 { type: 'Foo' }
type WithPropBar = DynamicPropertyName<'Bar'> // 类型为 { type: 'Bar' }

// 校验符合预期
const foo1: WithPropFoo = { type: 'Foo' }   // 校验通过
const foo2: WithPropFoo = { type: 'Hello' } // 类型不匹配，校验报错
const bar1: WithPropBar = { type: 'Bar' }   // 校验通过
const bar2: WithPropBar = { type: 'Hello' } // 类型不匹配，校验报错

如果是配合 class 使用，你也可以直接从 class 构造函数的 name 属性取值来减少重复定义，但需要额外声明 name 为字面量类型：

class Foo {
  static readonly name: 'Foo' = 'Foo'
}
type WithPropFoo = DynamicPropertyName<typeof Foo.name>

注意 interface 没有运行时实体，无法通过类似方式获取名称，只能手动传入字符串字面量。

内容的提问来源于stack exchange，提问作者Sagid