React three ways to create components

React three methods of creating components:
 1 . Stateless functional 
  pure show, it does not involve in the operation state, only to show the passed props, with only render () method; 
Features: 
    component is not instantiated, overall rendering performance has been improved 
    components can not access this 
    you can not use life cycle

 2 React.createClass.   
    is a way es5 of

 3 React.Component. 
    now the most common way (es6) 


difference between the two ways of creating a component after: 

a, since this function binding 

components React.createClass created, each member of which this function has React automatically bound; 


components React.Component created, its members are not automatically bind this function, you need to manually bind, otherwise this current component instance object can not obtain 

 three kinds of bound method:
 1 . constructor 
    constructor (The props) { 
      Super (The props); 
      the this .handleClick = the this .handleClick.bind ( the this ); 
    }

2.bind ( the this ) 
   <div the onClick = { this.handleClick.bind ( the this)}> </ div> . 3 . Arrow function 
    <div the onClick = {() => this.handleClick ()}> </ div>
 
two , and component properties propTypes props default configuration different attributes defaultProps

class TodoItem extends React.Component {
    static propTypes = {//类的静态属性
        name: React.PropTypes.string
    };

    static defaultProps = {//类的静态属性
        name: ''
    };

    ...
}


const TodoItem = React.createClass({
    propTypes: { // as an object
        name: React.PropTypes.string
    },
    getDefaultProps(){   // return a object
        return {
            name: ''    
        }
    }
    render(){
        return <div></div>
    }
})