[Typescript] Create an Object Whose Keys Are Derived From a Union
Let's say we have
type TemplateLiteralKey = `${"user" | "post" | "comment"}${"Id" | "Name"}`;
We want to make a type
type ObjectOfKeys = unknown;
In order to get result: assume the object value should be string type for each prop
type tests = [
Expect<
Equal<
ObjectOfKeys,
{
userId: string;
userName: string;
postId: string;
postName: string;
commentId: string;
commentName: string;
}
>
>
];
I wrote like this:
type ObjectOfKeys = { [Key in TemplateLiteralKey]: string };
It is also fine to write like this:
type ObjectOfKeys = Record<TemplateLiteralKey, string>;
Another example:
import { Equal, Expect } from "../helpers/type-utils";
type Event = `log_in` | "log_out" | "sign_up";
type ObjectOfKeys = Record<Uppercase<Event>, string>;
type tests = [
Expect<
Equal<
ObjectOfKeys,
{
LOG_IN: string;
LOG_OUT: string;
SIGN_UP: string;
}
>
>
];
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具
2019-12-11 [Algorithm] 13. Roman to Integer
2018-12-11 [Javascript] Wrap fireEvent with fireEventAsync
2018-12-11 [CSS3] Understand CSS Selector Specificity
2017-12-11 [Parcel] Bundle a React App with Parcel
2017-12-11 [Javascript] Specify this using .call() or .apply()
2017-12-11 [Javascript] this in Function Calls
2017-12-11 [Python] Create a Log for your Python application