使用带有箭头函数的泛型类型时出现 Typescript Playground 错误

Question

在将泛型类型与箭头函数一起使用时，Typescript Playground 会抛出错误Cannot find name 'T'

链接在这里

function hasAllProperties <T>(obj: any, props: (keyof T)[]): obj is T {
    return props.every((prop) => obj.hasOwnProperty(prop))
}

// This throws error , wont compile 
const hasAllPropertiesArrow = <T>(obj: any, props: (keyof T)[]): obj is T => {
    return props.every((prop) => obj.hasOwnProperty(prop))
}

由于我是泛型类型的新手，我认为这不是 ts Playground 的错误，而是我缺乏理解。另外，如何将普通函数重写为箭头函数？

Answer 1

这是 TypeScript解析器的设计限制；请参阅microsoft/TypeScript#15713以获得权​​威答案。该语法const x = <T>()欺骗编译器，使其认为这<T>是一个JSX标签；您可以通过查看错误消息的其余部分来验证这一点，其中内容如下JSX element 'T' has no corresponding closing tag.

如果您不需要 JSX/TSX 支持，您可以删除编译器选项设置--jsx，如此Playground 链接中所示。如果您确实需要 JSX 支持，那么您可以通过在引入T类型参数后使用尾随逗号来解决此问题：

const hasAllPropertiesArrow = <T,>(obj: any, props: (keyof T)[]): obj is T => {
    return props.every((prop) => obj.hasOwnProperty(prop))
}

这个逗号对代码的含义没有影响，但它可以防止解析器感到困惑。

Playground 代码链接