Объяснить знак вопроса (?), Используемый в коде ES6/JSX

Я использую библиотеку, называемую реакциями-реакциями в приложении React. Чтобы лучше понять, как это работает, я читал код, но соглашение продолжает появляться, что меня смущает. Здесь код ES6/JSX:

'use strict';

var React = require('react/addons');
var cx = React.addons.classSet;

var Checkbox = React.createClass({

  propTypes: {
/...code.../
  },

  render(): ?ReactElement {
    /...code.../
  },

  onChange(e: {target: {checked: boolean}}) {
    /...code.../
  }
});

module.exports = Checkbox;

Примечание render(): ?ReactElement {}. Это то, что меня смущает. Может ли кто-нибудь дать указания о том, где узнать больше об этом синтаксисе? Я ударил много тупиков через Google.

Ответы

Ответ 1

Если вы перейдете в package.json из форм-ответов и посмотрите раздел браузера:

  "browserify": {
    "transform": [
      [
        "reactify",
        {
          "es6": true,
          "target": "es5",
          "stripTypes": true
        }
      ]
    ]
  },

stripTypes включен. Он выделяет такие вещи, как ?ReactElement, что означает, что возможно возвращает ReactElement (и иначе null или undefined)

{target: {checked: boolean}} означает e имеет свойство target, которое имеет проверенное свойство, которое является булевым.

Это подсказки для проверки типа потока. Вы также увидите @flow в комментарии в верхней части всех файлов, которые должны быть проверены типом. Проверка типа - это инструмент, подобный модульным испытаниям, который делает вас более уверенными в правильности вашей программы, чтобы не требовать ручного тестирования. Во многих случаях эти небольшие аннотации типа заменяют единичные тесты, которые мы в противном случае писали бы.

Если вы используете поток в своем проекте и пытаетесь сделать что-то вроде:

<Checkbox />

Это даст вам ошибку типа, потому что значение и onChange необходимы для реквизита. В отличие от проверки регенерации времени выполнения, это происходит без фактического запуска кода (часто, как только вы сохраняете файл).