javascript - ES6语法

Question

在检查一个开源项目（react data grid）的来源时，我偶然发现了这种无法解决的语法：

class EditorBase extends React.Component {

  getStyle(): {width: string} {
    return {
      width: '100%'
    };
}

特别是getStyle(): {部分。

我曾尝试咨询其他SO问题，MDN function和classes引用，但没有提及上述语法。

我在这里缺少什么？

Answer 1

所以这看起来是Flow-type（由Facebook创建）的用法，它是Javascript的静态类型检查器。 （您可以将其视为Linter，但数据类型而非语法）

所以看起来令人困惑的部分可能就是这样：

{width: string}

在流程中，当你在函数的括号后面有一个冒号时，它将表示该函数的预期返回类型。

此代码通知Flow该函数应返回一个对象，该对象的“宽度”键应为“string”类型。

查看Flow.org了解更多信息，以及如何开始自己使用它！

Answer 2

您要引用的代码检查传递给方法的变量类型。

流程代码/类型检查仅在开发模式下使用，并将被babel剥离。

  

Flow是JavaScript的静态类型检查器。

详细了解flow。

这是用于反应数据网格的babel plugin。它实际上已被弃用，您应该使用babel flow-runtime（如果您想使用它）。