从接触 React 到多个项目中运用 React，已经有1年多时间了，经常在面试中被问起，而我的回答中总是有很多待提高的空间，写下这篇，希望能帮自己整理下思路~
- Webpack 自动化构建工具
- Redux 数据流
- React 组件
- React 生命周期
- 实用依赖包介绍。immutable 、reselect
Webpack
一个前端自动化的构建工具，可以打包，预处理各种文件，并将各种模块生成一张依赖关系图谱，在浏览器中被若干个入口文件载入。
- webpack 是一个现代 Javascript 应用程序的模块打包器(module bundler)
- 当webpack 处理应用程序时，会递归地构建一个依赖关系图(dependency graph),包含应用所需要的每一个模块
- 将所有模块打包成少量的 bundle, 由浏览器加载
高度可配置，包含四个核心：入口entry, 出口output, 加载器loader, 插件plugins
- loader: 在文件被添加到依赖图中时，将其转换
- plugins: 在webpack编译中被调用，存在于整个生命周期中
Redux
- javaScript 上一个可以预测的状态容器，单向数据流，函数式特性，更优雅
- 整个应用只有一个唯一的可信数据来源，一个Store
- State 只能通过触发 Action 来更改
- State 必须次而成纯函数，每次更改返回一个新的State
pure function: 没有任何副作用，对于同样的参数，无论何时调用都返回相同的结果
Store 与 state: Store 拥有一些方法来管理状态，state 用简单的数据结构表示状态
Actions
一个包含{type, payload} 的对象
Reducer
用来处理Action触发的状态树的更改，用对象扩展的写法可以在不改变旧的state下,返回一个新的state
Store
- 连接 Action 和 Reducer
- 管理整个State 状态树
- 提供getState,dispatch, subscribe方法
store.dispatch(action) => reducer(state,action) => store.getState()
store 会保存root reducer 中返回的状态树，用新的替代旧的
React-redux
Provider: 作为一个容器组件，用来接收 Store, 并且让Store对子组件可用
render(
<Provider store={store}>
<App /> // 子组件可以通过 connect 方法关联 store
</Provider>
)
Connect
connect([mapStateToProps], [mapDispatchToProps],[mergeProps], [options]) 参数均可选
- mapStateToProps: (state, [ownProps]), 指定了第一个参数就会开启组件监听，返回的props会合并到组件的props中
- mapDispatchToProps: (dispatch, [ownProps]), 在函数里直接dispatch action creator ，返回对象将会合并到props中
React 组件
容器组件
常规组件
表单常用状态属性：value, checked, selected, 均支持 onChange 事件
设置了上述状态属性就是受控组件
依赖包
Reselect
创建一个可记忆的选择器，避免不必要的重复计算
immutable
- 一旦创建就不能被更改的数据，采用旧数据创建新数据时，保证旧数据同时可用且不变。
- 使用结构共享数据，如果对象中一个节点发生改变，只修改这个节点和受它影响的父节点，避免了深拷贝，提高性能
Redux Middleware
提供位于 action 被发起之后，到达 reducer 之前的扩展点。通常用来进行日志记录，创建崩溃报告，处理路由等
