濮阳网站设计公司,asp.net 获取网站域名,企业所得税税率2022年最新税率表,广告公司网站设计策划记录面试过程 常见问题#xff0c;如有错误#xff0c;欢迎批评指正
1. 什么是虚拟DOM#xff1f;为什么它提高了性能#xff1f;
虚拟DOM是React创建的一个轻量级JavaScript对象#xff0c;表示真实DOM的结构。当状态变化时#xff0c;React会生成新的虚拟DOM#xf…记录面试过程 常见问题如有错误欢迎批评指正
1. 什么是虚拟DOM为什么它提高了性能
虚拟DOM是React创建的一个轻量级JavaScript对象表示真实DOM的结构。当状态变化时React会生成新的虚拟DOM并通过Diff算法比较新旧差异仅更新变化的部分到真实DOM。这减少了直接操作DOM的次数避免了昂贵的重绘和重排从而提升性能。
2. React类组件和函数组件的区别Hooks的作用是什么
类组件使用ES6类定义有生命周期方法和状态this.state。
函数组件无状态但通过Hooks如useState, useEffect可管理状态和副作用。
Hooks作用允许函数组件使用状态、生命周期等特性简化代码并促进逻辑复用。
3. 解释useEffect的依赖数组的作用。
空数组[]仅在组件挂载和卸载时执行类似componentDidMount和componentWillUnmount。
无数组每次渲染后都执行。
包含变量的数组[a, b]当a或b变化时执行。
4. 受控组件与非受控组件的区别
受控组件表单数据由React组件管理通过value和onChange。
非受控组件表单数据由DOM自身管理通过ref获取值如input ref{inputRef} /。
5. 为什么列表渲染时需要key
key帮助React识别元素变化优化Diff算法效率。若缺少key可能导致性能下降或渲染错误如状态错乱。
6. React Router如何实现动态路由和路由守卫
动态路由使用参数占位符如Route path/user/:id /通过useParams()获取参数。
路由守卫封装Route组件结合useNavigate和条件渲染如检查用户权限后重定向。
7. React性能优化方法有哪些
常用方法
a、使用React.memo缓存组件。
b、useMemo和useCallback避免重复计算和函数重建。
c、代码分割React.lazy Suspense实现懒加载。
d、避免在渲染函数中进行高开销操作。
8. Redux的核心概念是什么与Context API的区别
Redux核心单一状态树通过action触发reducer更新状态使用中间件处理异步。
与Context区别Redux适合大型应用全局状态管理提供调试工具和中间件Context适合局部跨层级数据传递无需额外库。
9. React合成事件是什么
React将浏览器原生事件封装为合成事件提供跨浏览器一致性并自动管理事件绑定事件委托到根节点。
10. 错误边界Error Boundaries如何实现
通过类组件的static getDerivedStateFromError()和componentDidCatch()捕获子组件树中的错误显示降级UI函数组件暂不支持。
11. React 18有哪些新特性
主要特性
a、并发模式Concurrent Mode可中断渲染优化用户体验。
b、自动批处理合并多个状态更新减少渲染次数。
c、新Hooks如useId生成唯一IDuseTransition管理非紧急更新。
12. Hooks使用规则有哪些
规则
只在函数组件或自定义Hooks顶层调用。
不能在循环、条件或嵌套函数中使用。
13. JSX是什么如何转换为JavaScript
JSX是语法糖会被Babel转换为React.createElement()调用生成React元素对象如React.createElement(div, null, Hello)。
14. 高阶组件HOC与Render Props的区别
HOC通过函数包装组件返回增强功能的新组件如withRouter(Component)。
Render Props通过组件传递函数prop动态渲染内容如DataProvider render{data Child data{data} /} /。
15. React严格模式的作用
检测不安全的生命周期方法、过时的API使用识别意外的副作用如重复调用渲染函数帮助提升代码质量。
