在 TypeScript 中调用一个以 union 作为返回类型的函数后，如何获得 vscode 自动完成功能？

Question

调用返回联合类型的函数后，如何获得正确的编辑器自动完成功能？

例如，在下面的代码中，在调用getProperty<ColorfulOrCircle>() （第 14 行）之后，变量b应该告诉我我可以访问哪些属性，但这不会发生。

1. interface Colorful {
2.   color: string;
3. }
4. interface Circle {
5.   radius: number;
6. }

8. type ColorfulOrCircle = Colorful | Circle;

10. function getProperty<T>(cc: T): T {
11.   return cc;
12. }

14. let b = getProperty<ColorfulOrCircle>({color: "red"})

15. b. ; // NO AUTOCOMPLETE

当我将鼠标悬停在b.color上时，我收到以下错误消息：

当我在b. ，我只收到“随机”的话。

我应该如何键入我的函数以获得更好的智能感知？

Answer 1

当不指定泛型类型但让打字稿推断它时，这非常有效。 但正如您所见，这个函数现在需要在其声明中使用泛型类型。 如果您想拥有一个可以像问题中的原始函数一样采用通用参数的函数，请查看我在底部包含的操场链接。

代码：

interface Colorful {
    color: string;
}
interface Circle {
    radius: number;
}

type ColorfulOrCircle = Colorful | Circle;

function getProperty<T extends ColorfulOrCircle>(cc: T) {
    return cc;
}

let b = getProperty({ color: "red" })

b. ; // AUTOCOMPLETE

操场