React 产生的背景
react是Facebook官方推出的一个javascript的库。Facebook为什么还要开发一款新的框架呢？原因是 Facebook遇到了一些新的问题：如何构建数据不断变化的大型应用。如何解决由数据不断变化带来的问题。
数据变化会带来两个非常严重的问题，第一要进行大量的dom操作;第二逻辑也会变得非常复杂。数据和逻辑密切相关，数据变化的时候，逻辑也会发生变化。在开发中，当你修改一个已有项目的时候，改动一个地方的代码，往往会产生许多意料之外的后果，这就是因为数据和逻辑之间的关系非常复杂，牵一发而动全身，所以数据变化会导致这样两种后果。
那react如何来解决这两个问题呢？针对第一个问题（大量操作dom）react的操作是采用自动dom操作，在react中，你不需要手动进行dom操作，只需要告诉react要展示什么内容，react会自动来操作dom。针对第二个问题(逻辑复制)，react是把状态和内容显示对应起来，这样我们就可以一目了然的知道，状态变化，内容会随之变化，从而理清程序的逻辑。
React 是什么：
react 其实就是一个做UI的库，具体来说是做UI组件的库，专注于做MVC中V。所以请记住React 并不是一个MVC的框架
React 的特点：
- 声明式： 你只需要声明给react显示什么内容，至于如何把这些内容显示到页面上，是由react来帮你完成的
- 高效：React 通过对DOM的模拟，最大限度的减少与DOM的交互。
- 灵活：React 可以与已知的库或框架很好地配合
React 的核心：
React的核心是组件，组件的设计目的是提高代码的复用率，降低测试难度和代码复杂度。
- 组件提高代码复用率：组件将数据和逻辑封装，类似面向对象中的类。我们可以将通用的逻辑和数据封装起来，从而能提高代码的复用率。
- 降低测试难度：组件高内聚，低耦合，很容易对单个组件进行测试，通过模拟他的输入，或者输出，来测试组件的功能是否完善。
- 降低代码复杂度：直观的语法可以极大地提高可读性，降低代码的复杂度和维护难度。
React 的性能秘诀：
我们知道DOM更新通常是比较昂贵的。而React为了尽可能地减少对DOM的操作，提供了一种不同的而又强大的方式来更新DOM，代替直接的DOM操作。就是Virtual DOM, 它是React抽象出来的一个对象，描述dom应该什么样子的，应该如何呈现。通过这个Virtual DOM去更新真实的DOM。
为什么通过这多一层的Virtual DOM操作就能更快呢？ 这是因为React有个diff算法，更新Virtual DOM并不保证马上影响真实的DOM，React会等到事件循环结束，然后利用这个diff算法，通过当前新的dom表述与之前的作比较，计算出最小的步骤更新真实的DOM。
React 的基本语法：
react 对象 createElement 方法：定义一个虚拟dom
第一个参数：表示虚拟dom的名称（任意元素的名称,还可以是一个组件的名称）
第二个参数：表示这个虚拟dom上一些必要的属性（比如：id, className, title等）
第三个参数：表示该虚拟你dom 中所以子元素（定义文本节点，我们可以不用书写createElement）
ReactDOM 中render 方法: 是将虚拟你dom渲染到页面
第一个参数：表示虚拟dom
第二个参数：表示真实dom容器元素
第三个参数：表示一个回调函数
组件：createClass
如果一个虚拟dom 复用多次，通常我们将它封装在一个组件中。通常用组件创建一组虚拟DOM
参数是一个对象，对象中的属性和方法是对组件的说明。
有个属性叫render 方法，是将组件中的虚拟dom 输出。
所以我们将虚拟dom定义在render 方法中。
Render: 返回值是虚拟dom树
作用域是组件当前对象。
组件需要通过React.createElement()才能渲染到页面中
网友评论