如何使用TypeScript从接口动态推断类型？

Question

TypeScript 文档 中介绍了如何使用函数重载。

以下用例是一个静态定义的重载函数示例。

interface MyObject {
    a: boolean
    b: number
}

const myObject: MyObject = {
    a: true,
    b: 1
}

function getValueOfMyObject (key: 'a'): boolean
function getValueOfMyObject (key: 'b'): number
function getValueOfMyObject (key: keyof MyObject): boolean | number {
    return myObject[key]
}

因此，getValueOfMyObject('a')将返回一个布尔类型，而getValueOfMyObject('b')将返回一个数字类型。

对于我的用例，我不想为MyObject接口中的每个新属性输入更多的重载。我正在寻找一种具有动态返回类型的解决方案。一种TypeScript根据MyObject接口自动推断返回类型的方法。类似这样：

function getValueOfMyObject (key: keyof MyObject): typeof MyObject[key] {
    return myObject[key]
}

然而，这似乎不是正确的语法。是否有任何方法可以使用TypeScript实现此目的？

- Kees van Lierop

Answer 1

你只需要使用一个类型参数来捕获函数被调用时的实际字面类型。有了这个类型参数，我们就可以索引到 MyObject 类型中。

interface MyObject {
    a: boolean
    b: number
}

const myObject: MyObject = {
    a: true,
    b: 1
}
function getValueOfMyObject<K extends keyof MyObject>(key: K): MyObject[K] {
    return myObject[key]
}
getValueOfMyObject('a') // K is 'a', returns boolean
getValueOfMyObject('b') // K is 'b', returns number

- Titian Cernicova-Dragomir