这两个流类型别名有什么区别？答案

【问题标题】：What is the difference between these two flow type aliases?这两个流类型别名有什么区别？
【发布时间】：2019-07-19 02:28:25
【问题描述】：

有人能解释一下 React 应用中这两种流类型别名之间的区别吗？

type Props = {
    handleChange(): void, // 1 
    handleChange: () => void, // 2
}

【问题讨论】：

标签： reactjs flowtype

【解决方案1】：

两者相似。他们只是将类型转换为undefined。

在第一个代码示例中，您正在调用函数然后指示它返回 void。

在第二个代码示例中，您定义了一个方法，该方法使用类型转换的方式返回一个返回 void 的函数。

我个人偏好定义像第二个代码示例。

【讨论】：

【解决方案2】：

两者都定义了名为handleChange 的可调用对象，它们不接受任何参数并且不返回任何内容。从类型上看，它们是等价的，但作为文档，它们是不同的。第一个是一个方法，第二个是一个函数属性，它暗示它已经有一个绑定this，而第一个没有。

在像element.onclick = props.handleChange 这样的无点上下文中使用时，第一个表示用法应该是element.onclick = props.handleChange.bind(props)，因为它是一种方法，并且适当的this 很重要。第二个表示可以简单地写element.onclick = props.handleChange，因为它是一个函数而不是一个方法。

【讨论】：