TypeScript如何基于类型对象实现函数key与对应值的类型映射

前提已知类型映射 #

type MyTypeMapping = {
  Key1: Type1;
  Key2: Type2;
};

1. getVal函数类型定义 #

通过泛型绑定入参key和返回值的对应关系，写法如下：

const getVal = <K extends keyof MyTypeMapping>(key: K): MyTypeMapping[K] => {
  return getObjectFromStorage(key) as MyTypeMapping[K]
}

调用时TS会自动根据传入的key推导返回值类型：

• 传入Key1时，返回值自动识别为Type1
• 传入Key2时，返回值自动识别为Type2

如果你的getObjectFromStorage本身已经实现了泛型类型推导，也可以去掉代码里的类型断言。 #

2. setVal函数类型定义 #

同样用泛型绑定第一个入参key的类型，第二个参数val的类型直接取对应key的映射类型即可：

const setVal = <K extends keyof MyTypeMapping>(key: K, val: MyTypeMapping[K]) => {
  return setObjectInStorage(key, val)
}

调用时TS会自动校验：如果第一个参数传Key2，第二个参数必须是Type2类型，否则会直接抛出类型错误。 #

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