TypeScript泛型对象获取字符串字面量类型丢失问题求解

根因分析 #

• 普通对象的字符串属性默认会被TS推断为string类型，不会自动保留字面量类型，你定义的myObj.key默认推断结果就是string，而非"myKey"字面量。
• 动态计算键的对象（{[key]: value}写法）默认会被TS推断为Record<string, ValueType>类型，不会自动绑定键的字面量类型，需要显式声明返回类型做映射。

解决方案 #

使用TS 4.9推出的const泛型特性，在函数侧自动捕获入参的字面量类型，同时显式声明函数返回类型绑定键的字面量，不需要调用方手动加as const，符合你的需求。

完整实现代码 #

const myObj = {
  key: "myKey",
  otherStuff: {stuff:3}
}

type SomeObj<T extends string> = {key: T} & Record<string, any>

// 泛型前加const修饰符，自动捕获入参的字面量类型
function makeObject<const TEntry extends SomeObj<string>>(entry: TEntry){ 
  // 显式声明返回类型，将键映射为入参key的字面量类型
  return {[entry.key]: entry} as { [K in TEntry['key']]: TEntry }
}

const result = makeObject(myObj)
// result 类型推断结果：
// const result: {
//     myKey: {
//         key: "myKey";
//         otherStuff: {
//             stuff: number;
//         };
//     };
// }

低版本TS兼容方案 #

如果你的TS版本低于4.9无法使用const泛型，可以调整函数泛型定义，调用时传入as const即可：

function makeObject<TKey extends string, TEntry extends SomeObj<TKey>>(entry: TEntry){ 
  return {[entry.key]: entry} as { [K in TKey]: TEntry }
}

const result = makeObject(myObj as const)

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