React
1.react 的了解
react 是 Facebook 开发的前端 JavaScript 库,V 层：react 并不是完整的 MVC 框架，而是 MVC 中的 C 层；react 引入虚拟 DOM，每当数据变化通过 reactdiff 运算
2.什么是 JSX？为什么浏览器无法读取 JSX？
JSX 是 JavaScript XML 的简写，是 react 使用的一种文件，它利用 JavaScript 的表现力和类似 HTML 的模板语法，得 HTML 文件非常容易理解。此文件能使应用非常可靠，并能够提高其性能，浏览器只能处理 JavaScript 对象，而不能读取常规 JavaScript 对象中的 JSX，所以为了使浏览器能够读取 JSX，首先，需要用 Babel 转换器将 JSX 文件转换为 JavaScript 对 象，然后再将其传给浏览器
3.react 与 angular 有何不同？
react 是 Facebook 出品，angular 是 Google
react 只有 MVC 中的 C，angular 是 MVC
react 使用虚拟 DOM，angular 使用真实 DOM
react 是单项数据绑定，angular 是双向数据绑定
4.shouldComponentUpdate 是做什么的？
shouldComponentUpdate 这个方法用来判断是否需要调用 render 方法重新绘制 dom，因 为 DOM 的描绘非常消耗性能，如果我们能在 shouldComponentUpdate 方法中能够写出更优化的 dom diff 算法，可以极大的提高性能
5.react 性能优化是哪个周期函数？
shouldComponentUpdate
6.react 中 keys 的作用是什么？
Keys 是 react 用于追踪哪些列表中元素被修改、被添加或者被移除的辅助标识。在开发过程中，我们需要保证某个元素的 key 在其同级元素中具有唯一性。 在 react Diff 算法中 react 会借助元素的 Key 值来判断该元素是新近创建的还是被移动而来的元素，从而减少不必要的元素重渲染； 此外，react 还需要借助 Key 值来判断元素与本地状态的关联关系，因此我们绝不可忽视转换函数中 Key 的重要性
7.调用 setState 之后发生了什么？
当调用 setState 后，新的 state 并没有马上生效渲染组件，而是，先看执行流中有没有在批量更新中，如果有，push 到存入到 dirtyeComponent 中，如果没有，则遍历 dirty 中的component，调用 updateComponent,进行 state 或 props 的更新，然后更新 UI，react 进行 diff运算，与上一次的虚拟 DOM 相比较，进行有效的渲染更新组件
8.redux 本身有什么不足？
1、向事件池中追加方法时，没有做去重处理
2、把绑定的方从在事件池中移除掉时，用的是 arr.splice(index,1)，这样可能会引起数组塌 陷
3、reducer 中 state，每次返回都需要深克隆，可以在 redux 中获取状态信息时，深克隆， 这样就不用在 reducer 里深克隆了
9.setState 第二个参数的作用？
第一个参数是要改变的 state 对象, 第二个参数是 state 导致的页面变化完成后的回调，等 价于 componentDidUpdate
10.(在构造函数中)调用 super(props)的目的是什么？
super() 被调用之前，子类是不能使用 this 的，在 ES2015 中，子类必须在
constructor 中调用 super()。传递 props 给 super() 的原因则是便于(在子类中)能在constructor 访问 this.props
11.(组件的)状态(state)和属性(props)之间有何不同？
State 是一种数据结构，用于组件挂载时所需数据的默认值。State 可能会随着时间的推移 而发生突变，但多数时候是作为用户事件行为的结果Props(properties 的简写)则是组件的配置。props 由父组件传递给子组件，并且就子组件而言，props 是不可变的,组件不能改变自身 的 props，但是可以把其子组件的 props 放在一起(统一管理)
12.受控组件(controlledcomponent) ？
如 onChange 会更新 state，重新渲染组件，一个输入表单元素，它的值通过 react 的这 种方式来控制，这样的元素就被称为”受控元素”
13.高阶组件(higherordercomponent) ？
高阶组件是一个以组件为参数并返回一个新组件的函数。HOC 运行你重用代码、逻辑和 引导抽象，最常见的可能是 Redux 的 connect 函数，除了简单分享工具库和简单的组合，HOC 最好的方式是共享 react 组件之间的行为，如果你发现你在不同的地方写了大量代码来做同一件事时，就应该考虑将代码重构为可重用的 HOC
14.react 中组件如何进行数据传值？
父级传递子级：把数据挂载子组件的属性上，子组件通过 this.props 来接收父组件的数 据。
子级传递父级：父级需要定义一个修改数据的方法，把修改数据的方法传给子组件，当子 组件需要修改父级数据时，调用父级传过来的修改方法
兄弟组件传递：属于同一个父级，父组件分别和这两个组件传递。比如子组件 A 操作执行 父组件方法，父组件进行修改，然后把信息传给子组件 B
15.react-router 的原理
BrowserRouter 或 hashRouter 用来渲染 Router 所代表的组件
Route 用来匹配组件路径并且筛选需要渲染的组件
Switch 用来筛选需要渲染的唯一组件
Link 直接渲染某个页面组件
Redirect 类似于 Link，在没有 Route 匹配成功时触发
16.react Router v4 中使用 switch 关键字
使用时，
17.传递给 setState 的参数是一个 callback 而不是一个对象
因为 this.props 和 this.state 的更新可能是异步的，不能依赖它们的值去计算下一个state
18.react 性能优化的方案
减少 render 方法的调用;
避免使用状态提升来共享 state,此时应该使用 redux 解决方案;
保持稳定的 dom 结构，尽量避免 dom 节点跨层级移动操作;
使用 css 来隐藏节点，而不是真的移除或添加 DOM 节点等
19.为什么虚拟 DOM 会提高性能?说下他的原理
虚拟 dom 相当于在 js 和真实 dom 中间加了一个缓存，
利用 dom 的 diff 算法避免了没有 必要的 dom 操作，从而提高性能
20.setState 何时同步何时异步
setState 只在合成事件和钩子函 数（生命周期）中是“异步”的，
在原生事件和 setTimeout 中都是同步的
21.react 渲染机制
1、
当页面一打开，就会
调用 render 构建一棵 DOM 树
2、当
数据发生变化（ state | props ）时，
就会再渲染出一棵 DOM 树
3、此时，
进行 diff 运算，两棵 DOM 树
进行差异化对比，找到更新的地方进行批量改动
22.如何告诉 react 它应该编译生产环境版本？
通常情况下我们
会使用 webpack 的
DefinePlugin 方法来
将 node_ENV 变量值设置为production。
编译版本中 react 会忽略 propType 验证以及其他的告警信息，同时还会降低代码库的大小，
react 使用了 Uglify 插件来
移除生产环境下不必要的注释等信息