React 工作原理

Reactjs 起源于Facebook内部项目，是一个用来构建用户界面的 javascript 库，相当于MVC架构中的V层框架，与市面上其他框架不同的是，React 把每一个组件当成了一个状态机，组件内部通过state来维护组件状态的变化，当组件的状态发生变化时，React通过虚拟DOM技术来增量并且高效的更新真实DOM。本文将对React 的这些特点进行简单的介绍。

一个简单的React组件 --------HelloReact

考虑到偶的同学还不曾了解过React,我们先来写一个简单点的React组件，

// 创建一个HelloReact组件

var HelloReact = React.createClass({

    render:function(){

        return (

            <div>

                 Hello React!

            </div>

        )

    }

});

// 使用HelloReact组件

ReactDOM.render(

    <HelloReact />,

    document.querySelector('body')

)

这样就定义了一个React组件，当然要运行这段代码是有条件的，需要引入React库，还需要引入JSX语法转换库，这里不多说了，这些基础的东西还需要各位亲自实践才好！.

React 核心基础 ------虚拟DOM （Virtual DOM）

在前端开发的过程中，我们经常会做的一件事就是将变化的数据实时更新到UI上，这时就需要对DOM进行更新和重新渲染，而频繁的DOM操作通常是性能瓶颈产生的原因之一，有