使用典型代表公司

国外使用React的公司：Facebook，Flipboard，Airbnb，BBC，GitHub，Instagram，Reddit，Uber，WhatsApp，Yahoo

国内使用React的公司：支付宝，淘宝，大搜车，Teambition，豆瓣，豌豆荚

React 并不是完整的 MVC/MVVM 框架，它专注于提供清晰、简洁的 View（视图）层解决方案。而又与模板引擎不同，React 不仅专注于解决 View 层的问题，又是一个包括 View 和 Controller 的库。

React 不像其他框架那样提供了许多复杂的概念与烦琐的 API，它以 Minimal API Interface 为目标，只提供组件化相关的非常少量的 API。同时为了保持灵活性，它没有自创一套规则，而是尽可能地让用户使用原生 JavaScript 进行开发。只要熟悉原生 JavaScript 并了解重要概念后，就可以很容易上手 React 应用开发。

传统dom更新
真实页面对应一个 DOM 树。在传统页面的开发模式中，每次需要更新页面时，都要手动操作 DOM 来进行更新

虚拟dom：
DOM 操作非常昂贵。我们都知道在前端开发中，性能消耗最大的就是 DOM 操作，而且这部分代码会让整体项目的代码变得难以维护。React 把真实 DOM 树转换成 JavaScript 对象树，也就是 Virtual DOM

函数式编程

英文Functional Programming
它属于”结构化编程”的一种，主要思想是把运算过程尽量写成一系列嵌套的函数调用。

函数式编程好处：

代码简洁，开发快速
接近自然语言，易于理解
更方便的代码管理
易于"并发编程“
代码的热升级

函数式编程才是 React 的精髓。
工业界的编程方式一直以命令式编程为主。命令式编程解决的是做什么的问题。

JSX语法的由来

React 为方便 View 层组件化，承载了构建 HTML 结构化页面的职责。从这点上来看，React 与其他 JavaScript 模板语言有着许多异曲同工之处，但不同之处在于 React 是通过创建与更新虚拟元素（virtual element）来管理整个 Virtual DOM 的。

JSX 将 HTML 语法直接加入到 JavaScript 代码中，再通过翻译器转换到纯 JavaScript 后由浏览器执行。在实际开发中，JSX 在产品打包阶段都已经编译成纯 JavaScript，不会带来任何副作用，反而会让代码更加直观并易于维护。

编译过程由Babel 的 JSX 编译器实现。

JSX 的官方定义是类 XML 语法的 ECMAScript 扩展。它完美地利用了 JavaScript 自带的语法和特性，并使用大家熟悉的 HTML 语法来创建虚拟元素。

组件是一个集合体，就是把html，js，css放在一起形成一个组件，组件的写法就是jsx语法编写

创建react的一个组件

1、下载react  lib文件
2、导入各个文件
3、创建组件 createClass
4、渲染 render

1 . XML 基本语法

定义标签时，只允许被一个标签包裹。
标签一定要闭合。

2 . 元素类型
小写首字母对应 DOM 元素
大写首字母对应组件元素

3、react中如何去写css

1、基于class          --（className）
2、基于inner css  （facebook 主张的方式）  行间样式(json)
3、原型链和全局变量

4、react中事件机制

react自定义了一套符合w3c标准的事件机制

eg：
点击：   onClick
触摸结束：  onTouchEnd

5. HTML 转义
React 会将所有要显示到 DOM 的字符串转义，防止 XSS。
后台传过来的数据带页面标签的是不能直接转义的，具体转义的写法如下：

通过dangerouslySetInnerHTML={{__html:转译dom}}来实现

eg：
var content='<strong>content</strong>';   

React.render(
    <div dangerouslySetInnerHTML={{__html: content}}></div>,
    document.body
);

补充内容：

使用步骤
1、react.creatClass()创建组件
2、要去实现组件中render方法
3、在render方法中 通过return返回jsx生成页面中的html内容

注意：1、组件命名，首字母大写
2、render方法 ReactDOM.render(<组件/>,node节点)

react中写入css

1、base class—需要将react写class–用className代替class

2、每个组件都具有自己的属性和功能 inner css reactjs 行内 样式均是以json形式存在{color：’red’},react将变量嵌套jsx中，style={变量名称}

3、基于全局变量 也就是将css抽取变成全局变量 或者在组件原型链上面进行挂载

事件机制

（函数声明需要与render同级，因为在react.creatClass传入的是对象，声明的函数也是其中的一个对象，是react对象对外暴漏的原型链,render会计算return的方法，同样计算同级的方法）

1、直接写事件机制onClick={this.函数名}

2、将所有函数变量封装到全局变量中

3、原型链写法

在jsx中写逻辑 –要写在render和return之间

注释标签的方法{/标签/}

组件嵌套 不能多个节点渲染，否则最后一个组件覆盖前面的