Question

TypeScript Docs描述了如何利用函数重载。

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

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')将以boolean作为返回类型，并且

getValueOfMyObject('b')将以number作为返回类型。

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

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

但是，这似乎不是正确的语法。有没有办法用TypeScript做到这一点？

Answer 1

您只需要一个类型参数来捕获调用该函数的实际文字类型。使用此类型参数，我们便可以索引到te 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

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

1 个答案: