定义组件的时候，一开始就得导入react，不然会引起如下错误：
React must be in scope when using JSX
这是因为JSX最终会被转译成为依赖于React的表达式
一. React创建组件有三种方式
1.无状态组件
function HelloComponent(props, /* context */) {
return <div>Hello {props.name}</div>
}
ReactDOM.render(<HelloComponent name="Sebastian" />, mountNode)
官方对其声明如下：
在大部分React代码中，大多数组件被写成无状态的组件，通过简单组合可以构建成其他组件等；这种通过多个简单然后合并成一个大应用的设计模式被提倡。
1.组件不会被实例化，整体渲染性能得到提升
因为组件被精简成一个render方法的函数来实现的，由于是无状态组件，所以无状态组件就不会在有组件实例化的过程，无实例化过程也就不需要分配多余的内存，从而性能得到一定的提升。
2.组件不能访问this对象
无状态组件由于没有实例化过程，所以无法访问组件this中的对象，例如：this.ref、this.state等均不能访问。若想访问就不能使用这种形式来创建组件
3.组件无法访问生命周期的方法
因为无状态组件是不需要组件生命周期管理和状态管理，所以底层实现这种形式的组件时是不会实现组件的生命周期方法。所以无状态组件是不能参与组件的各个生命周期管理的。
4.无状态组件只能访问输入的props，同样的props会得到同样的渲染结果，不会有副作用
2.React.createClass
这种创建方式在现在已经被淘汰，所以不做过多介绍
3.React.Component
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
value:0
}
render() {
return (
<div></div>
);
}
补充：
image.png
