一、简介

Redux

js状态容器，

基本原则：

单一数据源state只读 可通过action 和reducert返回一个新的state使用纯函数来执行修改 接收先前的state和，并返回新的state

Universal渲染

Bable

js编译器

测试框架：Jasmine，Karma,Mocha

二、在Node.js中运行

npm install babel-register --save-dev

npm i -D babel-preset-es2015 babel-preset-react

React数据载体

state:内部状态

props：组件间 逐级

context：跨级传递数

props

验证props

React.propTypes

Context

Virtual DOM

sholdComponentUpdate()

命令式编程

函数式编程：可重复利用的函数

$(document).ready(function(){ return { type:'button', props:{ } } })

jsx语法

展开属性：

<Component {…data} />

无状态函数/组件

创建时始终保持一个实例，做到内存优化

1.4 React数据流

1.4.1 state

setState()组件会尝试重新渲染。

改变了内部状态，组件需要更新

异步方法，一个生命周期内所有的setState方法会合并操作。

过多的内部状态会数据流变得混乱，程序难以维护。

1.4.3 props

参数

className :根节点class。为方便覆盖原始样式classPrefix: class前缀。样式分离

组件能分解，一定要拆分。使用子组件的方式来处理。

内置props——children,代表组件的子组件集合。可更具传入子组件的数量来决定是否是数组类型。

<Tabs classPrefix={'tabs'} defaultActiveIndex={0} className=

标签将由break,continue语句引用。与循环语句配合使用

break continue

break退出循环执行循环后面的语句 continue退出本次循环，从循环顶部继续执行

var num=0; outer: for(var i=0;i<10;i++){ for(var j=0;j<10;j++){ if(i==5&& j==5){ break outer; } num++; } }

switch

switch ("hello") { case "hello": alert() break; case "good": break; default: alert() } 123456789