ReactJS组件的生命周期

1. 创建阶段：在ReactDom.render()启动之前被调用

   getDefaultProps：获取默认的属性值，处理props的默认值，在React.createClass调用。

2. 实例化阶段：

   在ReactDom.render()启动之后，会调用下面一系列方法

   1. getInitialState：初始化组件的state值，其返回值会赋给组件的this.state属性
   2. componentWillMount：该方法在render方法之前调用，业务逻辑放在这里去处理
   3. render：根据state值，渲染并返回一个虚拟的DOM
   4. componentDidMount：该方法在render方法之后调用，在该方法中，ReactJS会使用render方法返回的虚拟DOM对象来创建真实的DOM结构，组件内部可以通过this.getDOMNode()来获取当前组件的节点

   ---

   • state：组建的属性，主要用来存储组件自身需要的数据，每次数据更新都是通过修改state属性的值，ReactJS内部会监听state属性的变化，一旦发生变化，就会主动触发组件的render方法来更新虚拟DOM的结构
   • 虚拟DOM：将真实的DOM结构映射城一个Json数据结构

3. 更新阶段：主要发生在用户操作之后或父组件有更新的时候，此时会根据用户的操作行为进行相应的页面的调整

   1. componentWillReceiveProps：该方法发生在this.props被修改或父组件调用setProps()方法之后

   调用this.setSate方法来完成对state的修改

   2. shouldComponentUpdate：用来拦截新的props或state，根据逻辑来判断是否需要更新

   返回值为true，需要跟新；false，则不需更新

   3. componentWillUpdate：shouldComponentUpdate返回true的时候执行
   4. render：渲染组件，进行更新

   注意：这里的render并不是将所有的组件都进行更新，而是根据底层的diff算法，生成需要更新的虚拟DOM数据。在该方法中最好不要对state进行修改

   5. componentDidUpdate：组件更新完毕

4. 销毁阶段：

   componentWillUnmount：销毁时被调用，通常做一些取消事件的绑定、移除虚拟DOM中对应的数据结构、销毁一些无用的定时器等工作