react面试题

⼀、react⽣命周期函数

这个问题要考察的是组件的⽣命周期1、初始化阶段：

getDefaultProps:获取实例的默认属性getInitialState:获取每个实例的初始化状态

componentWillMount：组件即将被装载、渲染到页⾯上render:组件在这⾥⽣成虚拟的DOM节点componentDidMount:组件真正在被装载之后2、运⾏中状态：

componentWillReceiveProps:组件将要接收到属性的时候调⽤

shouldComponentUpdate:组件接受到新属性或者新状态的时候（可以返回false，接收数据后不更新，阻⽌render调⽤，后⾯的函数不会被继续执⾏了）

componentWillUpdate:组件即将更新不能修改属性和状态render:组件重新描绘

componentDidUpdate:组件已经更新3、销毁阶段：

componentWillUnmount:组件即将销毁⼆、为什么虚拟dom会提⾼性能?

虚拟dom相当于在js和真实dom中间加了⼀个缓存，利⽤dom diff算法避免了没有必要的dom操作，从⽽提⾼性能。具体实现步骤如下：

⽤ JavaScript 对象结构表⽰ DOM 树的结构；然后⽤这个树构建⼀个真正的 DOM 树，插到⽂档当中当状态变更的时候，重新构造⼀棵新的对象树。然后⽤新的树和旧的树进⾏⽐较，记录两棵树差异把2所记录的差异应⽤到步骤1所构建的真正的DOM树上，视图就更新了三、react性能优化⽅案

（1）重写shouldComponentUpdate来避免不必要的dom操作。（2）使⽤ production 版本的react.js。

（3）使⽤key来帮助React识别列表中所有⼦组件的最⼩变化。四、react组件的划分业务组件技术组件？

根据组件的职责通常把组件分为UI组件和容器组件。UI 组件负责 UI 的呈现，容器组件负责管理数据和逻辑。两者通过React-Redux 提供connect⽅法联系起来。

五、在 React中元素（ element）和组件（ component）有什么区别？简单地说，在 React中元素（虛拟DOM）描述了你在屏幕上看到的DOM元素。

换个说法就是，在 React中元素是页⾯中DOM元素的对象表⽰⽅式。在 React中组件是⼀个函数或⼀个类，它可以接受输⼊并返回⼀个元素。

注意：⼯作中，为了提⾼开发效率，通常使⽤JSX语法表⽰ React元素（虚拟DOM）。在编译的时候，把它转化成⼀个 React.createElement调⽤⽅法。

六、React 中的key是什么？为什么它们很重要？

key可以帮助 React跟踪循环创建列表中的虚拟DOM元素，了解哪些元素已更改、添加或删除。

每个绑定key的虚拟DOM元素，在兄弟元素之间都是独⼀⽆⼆的。在 React的和解过程中，⽐较新的虛拟DOM树与上⼀个虛拟DOM树之间的差异，并映射到页⾯中。key使 React处理列表中虛拟DOM时更加⾼效，因为 React可以使⽤虛拟DOM上的key属性，快速了解元素是新的、需要删除的，还是修改过的。如果没有key,Rεat就不知道列表中虚拟DOM元素与页⾯中的哪个元素相对应。所以在创建列表的时候，不要忽略key。