1、React 是什么
一个用于创建 可复用、可聚合 Web组件的js库；
只提供了前端 MVC 框架中的 "v"，一个并不是一个完整的MVC框架；
2、为什么用React
a、 组件化的，而不是写一大堆HTML模板；将JS逻辑与HTML标签紧密的连接，并且容易理解；
angular组件定义 和 React 组件定义大致相似，但template处不同：1）、angular中template 后写html标签要转换成字符串且换行处加\， 或者常将template 换成templateUrl ->指向一个一个HTML文件； 2）、 而在reactr中，则可直接把html文件写在js里面，看起来更直观；
b、 单向数据流；
1）、 angular是双向数据绑定的； 2）、而react是单向数据流，react的单向数据特性导致：数据一旦更新，就直接重新渲染整个APP;
看到 "重新渲染整个APP"，我们的第一反应是这样会浪费资源，会变的很慢，其实不是的：我们在创建一个复杂的APP，要管理UI的状态其实很复杂，如果不是一次性将整个页面渲染好的话，我们要做很多操作（接收用户的输入 \ 修改数据 \ 异步API数据请求（服务器端请求json数据） \ 修改DOM树等）；
react的渲染方式和传统的服务器端渲染相似：
这种渲染方式将不会再有：1）魔法般的双向数据绑定； 2）数据模型的肮脏检查（dirty checking--检查数据或对象有没有更新) 3) 确切的DOM操作（不会再有很精确的DOM操作了）；
这种单向数据一次性将整个页面都渲染出来的好处：1）每个组件是做什么的，很直观； 2）结果更可预测； 3）组件之间的关系更清晰（不再会有复杂的关系，现在是将数据传给顶层组件，最后一次性渲染）；
我们可以将一个React组件理解成一个独立的函数：可以接受参数（props)、可复用、可传递、可以返回一个结果（渲染组件）；
c、虚拟的DOM 树
之前说过 "如果数据更新，react会将整个APP一次性渲染出来"，因为有了虚拟DOM树才可以渲染的这么快；
我们用javascript虽然很快，但我们进行DOM操作的时候却运行的很慢；那react是怎么处理这个问题的：1)react会重建一个DOM树（虚拟DOM)； 2）然后和上个版本的DOM进行差异的对比，找到他们的差异； 3）然后计算出如何用最小的操作区更新差异； 4）最后在操作队列里批量的执行DOM更新操作；
React也可以在Node.js中运行（服务器端）： 1）可以在服务器端 和 客户端 共用一些组件的逻辑（这个概念叫做Isomorphic javascript，这样我们可以少写一些代码)； 2）SEO友好，便于生成缓存的单页面应用； 3）可以直接渲染特定的页面，而不需要渲染整个APP;
3、React简单示例
1）、JSX是什么？
JSX是avaScript的XML的语法扩展，并不完全是HTML，采用了我们熟悉的 且 易于理解的语法来定义DOM树；
一个用于创建 可复用、可聚合 Web组件的js库；
只提供了前端 MVC 框架中的 "v"，一个并不是一个完整的MVC框架；
2、为什么用React
a、 组件化的，而不是写一大堆HTML模板；将JS逻辑与HTML标签紧密的连接，并且容易理解；
angular组件定义 和 React 组件定义大致相似，但template处不同：1）、angular中template 后写html标签要转换成字符串且换行处加\， 或者常将template 换成templateUrl ->指向一个一个HTML文件； 2）、 而在reactr中，则可直接把html文件写在js里面，看起来更直观；
b、 单向数据流；
1）、 angular是双向数据绑定的； 2）、而react是单向数据流，react的单向数据特性导致：数据一旦更新，就直接重新渲染整个APP;
看到 "重新渲染整个APP"，我们的第一反应是这样会浪费资源，会变的很慢，其实不是的：我们在创建一个复杂的APP，要管理UI的状态其实很复杂，如果不是一次性将整个页面渲染好的话，我们要做很多操作（接收用户的输入 \ 修改数据 \ 异步API数据请求（服务器端请求json数据） \ 修改DOM树等）；
react的渲染方式和传统的服务器端渲染相似：
这种渲染方式将不会再有：1）
这种单向数据一次性将整个页面都渲染出来的好处：1）每个组件是做什么的，很直观； 2）结果更可预测； 3）组件之间的关系更清晰（不再会有复杂的关系，现在是将数据传给顶层组件，最后一次性渲染）；
我们可以将一个React组件理解成一个独立的函数：可以接受参数（props)、可复用、可传递、可以返回一个结果（渲染组件）；
c、虚拟的DOM 树
之前说过 "如果数据更新，react会将整个APP一次性渲染出来"，因为有了虚拟DOM树才可以渲染的这么快；
我们用javascript虽然很快，但我们进行DOM操作的时候却运行的很慢；那react是怎么处理这个问题的：1)react会重建一个DOM树（虚拟DOM)； 2）然后和上个版本的DOM进行差异的对比，找到他们的差异； 3）然后计算出如何用最小的操作区更新差异； 4）最后在操作队列里批量的执行DOM更新操作；
React也可以在Node.js中运行（服务器端）： 1）可以在服务器端 和 客户端 共用一些组件的逻辑（这个概念叫做Isomorphic javascript，这样我们可以少写一些代码)； 2）SEO友好，便于生成缓存的单页面应用； 3）可以直接渲染特定的页面，而不需要渲染整个APP;
3、React简单示例
1）、JSX是什么？
JSX是avaScript的XML的语法扩展，并不完全是HTML，采用了我们熟悉的 且 易于理解的语法来定义DOM树；
2）React是如何使用JSX的
ReactDOM.render(
<h1>你好，中国！</h1>,
document.getElementById('demo')
);
//如上是将h1标签插入到 id为demo的元素中