我是 React 的新手并试图掌握语法。
我正在 React 15 环境中开发（使用 react-starterify 模板）并且一直在使用下面版本 2 中的语法，但是，我在 Facebook 的 React 页面中找到的大多数示例和教程都是版本 1。两个，我什么时候应该使用一个而不是另一个？
版本 1
var MyComponent = React.createClass({
render: function() {
return (
<ul>
// some list
</ul>
);
}
});
module.exports = MyOtherComponent;
版本 2
const MyComponent = () => (
<ul>
// some list
</ul>
);
export default MyComponent;
第二个代码是一个无状态的函数组件，是一个新的语法/模式，用于将组件定义为 的函数props。它是在 React v0.14 中引入的。
你可以在官方 React 博客上阅读更多关于它的信息，这里，在官方 React 文档上，这里。
这些组件的行为就像一个 React 类，只定义了一个渲染方法。由于没有为功能组件创建组件实例，因此添加到一个的任何 ref 将评估为 null。功能组件没有生命周期方法，但您可以在函数上设置
.propTypes和.defaultProps作为属性。此模式旨在鼓励创建这些应包含大部分应用程序的简单组件。将来，我们还将能够通过避免不必要的检查和内存分配来针对这些组件进行性能优化。
这种模式类似于“传统”模式，不同之处在于您使用的是简单函数而不是类中定义的方法。当您想从类中提取函数时，这会很有用（例如，为了可读性和清洁性）。
需要注意的一件重要事情是功能组件只是一个功能。这不是一个class。因此，没有全局this对象。这意味着当您执行 a 时，render您基本上是在创建 a 的新实例ReactComponent，从而排除了这些 javascript 对象通过某些全局this. 这也state导致无法使用任何生命周期方法。
性能
当你使用无状态的函数式组件时，React 足够聪明，可以省略所有“传统”的生命周期方法，结果证明它提供了大量的优化。React 团队表示，他们计划在未来进一步优化内存分配并减少检查次数。
适应性
因为我们只讨论一个函数（而不是一个类），所以我们不需要担心state、生命周期方法或其他依赖项。给定参数，该函数将始终给出相同的输出。因此，很容易在我们想要的任何地方调整这些组件，结果也使测试更容易。
使用 React 的无状态功能组件，可以轻松地对每个组件进行单独测试。不需要模拟、状态操作、特殊库或棘手的测试工具。
鼓励最佳实践
React 通常与MVC 模式的V相比较，因为它旨在创建视图。创建组件的“传统”方式使得将业务逻辑（例如使用state或ref）“侵入”到真正应该只处理渲染逻辑的组件中变得容易。他们鼓励懒惰和编写臭代码。然而，无状态的功能组件几乎不可能采取这样的捷径并强制采用更好的方法。
通常，建议尽可能使用新模式！如果您只需要一个render方法，但不需要生命周期方法 或state，请使用此模式。当然，有时您确实需要使用state，在这种情况下，您可以使用传统模式。
Facebook 建议在渲染静态表示组件时使用无状态组件。然后，如果需要某种状态，只需将它们包装在有状态组件中，以通过使用它的'state并将其发送props到无状态组件来管理它们。
添加，从 react 15.5.0 开始， React.createClass 将被弃用。他们建议您转到 ES2015 类或使用箭头功能。
当 React 最初发布时，在 JavaScript 中没有惯用的方法来创建类，所以我们提供了自己的：React.createClass。
后来，类作为 ES2015 的一部分添加到语言中，因此我们添加了使用 JavaScript 类创建 React 组件的功能。与功能组件一起，JavaScript 类现在是在 React 中创建组件的首选方式。
对于您现有的 createClass 组件，我们建议您将它们迁移到 JavaScript 类。