React 高频面试题1(答案和题目都是根据讯飞星火写的)

发布于:2024-07-03 ⋅ 阅读:(11) ⋅ 点赞:(0)

1. 解释React中的虚拟dom,并说明它是如何工作的。

虚拟dom是介于数据与真实dom之间的抽象层,是一个轻量级的JavaScript对象。react组件的状态或属性发生改变时会重新渲染组件,生成新的虚拟dom。然后react会比较新旧两个dom(这个过程就是diffing)。通过这个比较,react可以计算出更新真实dom所需要的最少步骤。若新旧两个dom,没有变化,则不更新真实dom。

2. 在react中,setState是如何工作的。它是同步还是异步?

setState是react中一个用于更新组件状态的函数。它接受一个新的状态值作为参数,并触发组件重新渲染。setState是异步的,这意味着当你调用setState时,React不会立即更新状态,而是将新的状态放入一个新的更新队列中,然后在合适的时机批量更新操作。这样的好处是可以优化性能,避免不必要的重复渲染。

3. React中,props与state有什么区别

props是父组件传递给子组件的数据。它们是只可读的,意味着子组件不可以直接修改它们的值。这是React单向数据流的核心概念,确保了数据的一致性和可预测性。但如果子组件需要更新状态或触发某些行为,它通常会通过调用父组件传递来的回调函数来实现。

state是组件自身的内部状态,可以通过setState来更改。当组件的状态发生改变时,React会重新渲染改组件,以映射最新状态。state通常用于存储组件的动态数据,例如表单输入,计数器等。

4. 在React中,如何使用useEffect Hook?

useEffect用于处理副作用,例如数据获取,订阅,手动更改dom等。它接受两个参数,一个函数,一个可选的依赖数组。

如果没有传递第二个参数,那么这个函数会在组件挂载和卸载是执行一次。这通常用于执行一次初始化或清理工作。

如果传递了非空依赖数组,那么useEffect中的函数仅在依赖项发生变化时执行。每次组件渲染后都会检查依赖项是否发生变化。如果依赖性有变化,则执行副作用。

需要注意的是,当组件卸载时,useEffect中的清理函数与会被执行,以确保资源得到妥善释放。

5. 在React中,useReducer和useState有什么区别?分别用于什么场景。

useRedecer和useState都是React中的hooks,用于在函数组件中管理状态,它们的主要区别在于状态管理方式与使用场景。

useState是用于管理单个状态变量的hook。它接受一个初始状态作为参数,并返回一个包含两个元素的数组,当前状态和一个更新状态的函数。你可以使用这个函数来更新状态,并且每次调用都会触发组件的重新渲染。

useRedecer用于管理多个相关联的状态变量的hook。它接受一个redecer函数和一个初始状态值作为参数,并且返回一个包含两个元素的数组:当前状态和一个派发动作的函数。redecer函数根据传入的动作类型来决定如何更新状态。