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 该函数应返回一个对象，该对象的键“width”应为“string”类型。

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