React生命周期和虚拟DOM

一.虚拟DOM

　　1.React并不直接操作DOM，React中的render方法，返回一个DOM描述，React能够将这个DOM描述与内存中的表现进行比较，然后以最快的方式更新浏览器

　　2.React实现了一整套事件系统，所有的事件对象符合W3C规范，并且事件冒泡跨浏览器支持。你能够使用HTML5事件，但是在老浏览器并不支持。

二.Refs and findDOMNode()

　　1.与浏览器交互，你将会需要一个DOM节点的引用，您能够将ref属性添加到任何一个元素，通过这种方式，你能够引用组件支持的实例，如果你要调用组件上的一个函数或者访问

底层DOM节点，那是非常有用的。在这篇文章中学习更多ref相关知识

三.生命周期

　　React中，组件的生命周期有三个阶段，分别为：初始阶段，更新阶段，销毁阶段

　　　　初始阶段：组件被插入DOM中

　　　　更新阶段：如果DOM应该被更新，组件重新渲染

　　　　销毁阶段：组件从DOM中移除

　　在这三个阶段，react都提供了一些钩子函数。总的来说，是Will方法和Did方法。Will方法在事情发生之前执行，Did方法在事情发生之后执行

　　1.初始化阶段

　　　　（1）

getInitialState()

。这个函数在组件被装载前调用，对于需要设置状态的组件，应该执行它，并且返回组件的初始状态

　　　　（2）

componentWillMount()。这个函数在组件即将被装载时调用，可以在这个函数中修改组件的状态

　　　　（3）

componentDidMount()

。这个函数在组件被装载后立即调用。调用这个方法的时候，组件已经被渲染在页面中了，所有在这个函数中可以修改DOM节点。

　　2.更新阶段

　　　　（1）

componentWillReceiveProps(object nextProps)

。当一个已经装载的组件接受到新的属性时调用，这个函数可以接受一个对象类型的参数，这个参数表示接受到的新属性，可以

修改这个新的属性

　　　　（2）

shouldComponentUpdate(object nextProps, object nextState)

。这个方法返回一个布尔值，在这个函数中，开发者可以决定DOM是否更新，如果返回false，表示阻止更新,

这个阶段的后续的钩子函数也不会被调用

　　　　（3）

componentWillUpdate(object nextProps, object nextState)

。这个方法在更新发生前立即调用，这个函数中不能修改组件的状态

　　　　（4）

componentDidUpdate(object prevProps, object prevState)

。这个方法在更新发生后立即调用。它接受两个对象类型的参数，这两个参数分别表示更新前的属性和更新前的

状态

　　3.销毁阶段

　　　　

componentWillUnmount()

。组件被卸载前调用。组件的清理操作（如：清除定时器，事件监听等）应该子啊这里进行