Question

考虑以下代码（同样在TS Play上）


interface Props<Item> {
    selectedItem?: Item
}

function makeReturn(props: Props) { // complaints : Generic type 'Props<Item>' requires 1 type argument(s).
    if (props.selectedItem) {
        return props.selectedItem
    }

    return ''
}

function useAutosuggest<Item>(
    userProps: Props<Item> = {}
) {
    const retVal = makeReturn(userProps);
    return retVal;
}

interface MyItem {
    city: 'string',
    rating: number
}

const selectedItem = useAutosuggest<MyItem>()

我的思考过程是–我该怎么做，以便makeReturn函数能够知道selectedItem应该是useAutosuggest所接受的任何类型（在这种情况下，{{ 1}}）。我不确定自己的想法是否正确。如果是的话，该怎么做才能在这个思考过程中采取行动，如果不是，那我认为错了吗？

Answer 1

您正在寻找的主要内容是函数泛型和返回类型，但是还有其他几件事会有所帮助。

首先，我建议使用“ T”代替Item。您不必这样做，但是它是常规的，在这种情况下，它使阅读起来更加清晰（我一直想知道“ Item类型在哪里！）

interface Props<T> {
    selectedItem?: T
}

对于您的主要问题，您需要使函数通用：

function makeReturn<T>(props: Props<T>): T|undefined {
    if (props.selectedItem) {
        return props.selectedItem
    }

    return undefined
}

或者从技术上讲也很好（假设props永远不会为null或未定义）：

function makeReturn<T>(props: Props<T>): T|undefined {
    return props.selectedItem
}

请注意返回类型如何为T|undefined。在您的示例中，您返回了一个空字符串。没有警告或错误，您就无法在TypeScript中做到这一点。

我稍微调整了下一个功能（但是有多种方法可以给猫换皮）：

function use<T>(userProps?: Props<T>): T|undefined {
    return makeReturn(userProps || {})
}

完整代码（playground）：

interface Props<T> {
    selectedItem?: T
}

function makeReturn<T>(props: Props<T>): T|undefined {
    if (props.selectedItem) {
        return props.selectedItem
    }

    return undefined
}

function use<T>(userProps?: Props<T>): T|undefined {
    return makeReturn(userProps || {})
}

interface MyItem {
    city: 'string',
    rating: number
}

const selectedItem = use<MyItem>()

打字稿：使泛型类型的参数从一个函数流向另一个函数

1 个答案: