Question

JSX 是 ECMAScript 一个类似 XML 的语法扩展。基本上，它只是为 React.createElement() 函数提供语法糖，从而让在我们在 JavaScript 中，使用类 HTML 模板的语法，进行页面描述。

在下面的示例中， <h1> 内的文本标签会作为 JavaScript 函数返回给渲染函数。

class App extends React.Component {
  render() {
    return(
      <div>
        <h1>{'Welcome to React world!'}</h1>
      </div>
    )
  }
}

以上示例 render 方法中的 JSX 将会被转换为以下内容：

React.createElement("div", null, React.createElement(
  "h1", null, 'Welcome to React world!'));

这里你可以访问 Babeljs 在线体验一下。

阅读资源： 从零开始实现一个 React（一）：JSX 和虚拟 DOM