一、ES6类组件

    React定义组件的两种方法 - 图1

    通过class继承React.Component类来创建一个子组件，我们的jsx语法的HTML结构需要写在render方法的返回值中。

    接收父传子传下来的数据可以直接在类的内部使用this.props.xxx来调用

    二、工厂函数组件

    React定义组件的两种方法 - 图2

    通过函数定义一个组件，jsx语法的HTML结构写在函数返回值中。

    父组件传下的参数可以通过在函数组件中的括号中接收一个props关键字，然后在内部通过props.xxx调用

    两种方法的优劣：

    工厂函数组件

    1、工厂函数组件不会被实例化，对整体的渲染性能有所提升

    2、组件不能访问this对象

    3、组件无法访问生命周期的方法

    4、无状态组件只能访问输入的props参数

    ES6类组件

    1、可以实例化，能访问组建的生命周期

    2、会自动绑定函数方法，从而导致不必要的性能开销

    3、除了ES6的class创建外，还可以通过React.createClass创建的组件，其每个成员函数的this都由React自动绑定

    4、React.creatClass的mixins不够自然、直观，但是ES6的class语法糖解决了这个问题

    总结：

    1、尽量使用无状态的工厂组件，减少性能开销

    2、如果需要使用到生命周期等高阶应用，则用类组件的方法创建组件