总结篇-React框架相关（未完待续...）

react的特点

1.虚拟DOM：
    组件不再是直接生成DOM，而是生成虚拟DOM，React通过diff算法将变化再重新渲染。

2.服务器端渲染：
    服务器端渲染解除了服务器端对浏览器的依赖，它会将“view”部分先渲染，然后再交给客户端做渲染。

3.组件化编码：
    组件其实就是自定义的标签，通过JSX语法方便快捷的return复用性很强的DOM解构。

4.声明式设计：
    React采用声明范式，函数式编程，可以轻松描述应用。

5.灵活：
    React可以与已知的库或框架很好地配合。

6.JSX：
    JSX 是 JavaScript 语法的扩展。React开发不一定使用 JSX ，但我们建议使用它。

7.单向响应的数据流:
    React数据是自顶向下单向流动的，即从父组件到子组件，props作为外部接口、state作为内部状态。

生命周期浅了解（详解）

可以概括为三个过程：挂载，更新，卸载
    1.挂载过程：初始化props；初始化state；虚拟DOM储存在内存；第一次DOM挂载成功；
    2.更新过程：应用状态state变化；
    3.卸载过程：componentWillUnmount组件从 DOM 中移除之前立刻被调用的唯一钩子；

获取挂载的DOM

1.生命周期中带有“did”的钩子函数里，都可以获取到挂载完的DOM节点；
2.带“did”的钩子函数有：componentDidMount && componentDidUpdata；
3.React中的ref属性，可以简单快捷的获取DOM节点

var One= React.createClass({
    render: function(){
        return <canvas ref='mainCanvas'>
    },
    componentDidMount: function(){
        var canvas = this.refs.mainCanvas.getDOMNode();  //挂载成功，可以访问到 Canvas 节点
    },
    componentDidUpdata: function(){
        var canvas2 = this.refs.mainCanvas.getDOMNode();  //挂载成功，可以访问到 Canvas 节点
    }
})

注意：
1.可通过原生JS的方法获取节点，但是写法较为复杂，如下：
    document.getElementsByClassName()
    document.querySelector()
    document.querySelectorAll()