React面试题

React 和 Vue 区别

• 1、React严格上是针对的是 mvc 中的 view 层 ，而Vue 是MVVM层
• 2、操作dom的方式不同 vue使用的是操作指令操作dom，react是通过js 进行操作js进行操作
• 3、数据绑定不同，vue实现的双向数据绑定，react的数据流动是单向的
• 4、react中的state 是不能直接改变的 ，需要使用setState来惊醒改变。vue中的state不是不是必须的，数据主要是由data属性在vue对象中管理的

react 钩子函数

类组件

• 1、新增的钩子函数： static getDerivedStateFromProps getSnapshotBeforeUdpateh componentDidUpdate
• 2、不推荐使用 ：UNSAFE_componentWillMount / componentWillReceiverProps / componentWillUpdate
• 3、因为react 16.x 中引入 协调算法 Fiber 内部采用异步渲染
  componentDidMount 对比 componentWillMount

函数式组件

• 1、react hooks (高阶组件)
  uesState uesEffect(相当于 componentDidmount/didUpdate/willUnmount) useContext useRef

context 上下文

• 组件props属性传递问题， redux内部 provider

react 性能优化

• 1、 shouldComponentUpdate true / false =====> PureComponent(纯组件 如果引用类型数值改变，render 同样不会渲染）
• 2、react.memo() 高阶组件

HOC 高阶组件 作用

• 1、本身是一个函数，接受一个组件 ，返回一个新组建，给这些组件 添加一些额外的props
• 2、redux --->connect() connect(mapState,mapDispatch)(UIcom)
• 3、setState 两种写法，过程 object.assign() 浅层合并 异步队列中 callback中获取最新的state
• 4、当你调用setState的时候，发生什么事情， 当调用setState时候，react第一件事情就是将传递给setState的对象 合并到组件的状态，这将启动一个称为和解的（reconciliation），一旦有了这个树，为了弄清UI如何响应新的状态而改变，react会将这个与上一个元素树相比较 （diff） 通过这个做，react将会知道发生的确切变化，并且通过了解发生变化，只需要在绝对必要的情况下，进行更新可最小化UI的占用空间

diff算法 虚拟dom v-for（map key作用）

react-router 分类 webapp react-router-dom 路由