资讯动态

React【面试】

发布时间:2026/8/8 18:06:25 来源:尧图企业网站定制
为什么 React 不允许直接修改 StateReact 希望通过 setState 统一管理组件状态的更新。直接修改 React 无法感知不会触发重新渲染视图不更新违背不可变数据设计引用地址不变浅比较判定无更新会让 useEffect、生命周期、批量更新逻辑错乱破坏调试工具和状态可回溯能力容易产生异步时序 Bug。本质原因 : React 做更新对比时用的是 浅比较Object.is 引用地址没变 → 判定状态无变化 → 不重渲染。React 为什么要坚持「不可变数据」依赖引用做浅比较判断是否需要重新渲染保证状态可追踪、可快照、可时间旅行调试避免意外副作用、防止旧状态污染新逻辑适配 React 批量更新、Hooks 依赖、Redux 状态管理让逻辑可预测、易于排查 Bug。【追问】日常怎么写不可变对象用 扩展运算符 {…obj}数组用 map/filter/reduce/ 扩展 […arr]不用 push/pop/splice复杂嵌套用 Immer 简化写法不用手动层层解构React 是什么React 是声明式、组件化、基于虚拟 DOM的前端 UI 库用于构建单页应用遵循单向数据流。虚拟 DOM 是什么用JS 对象描述真实 DOM 结构数据变化生成新虚拟 DOM通过Diff 算法对比差异只更新变化部分提升性能。为什么不用直接操作真实 DOM真实 DOM 操作开销大、重绘重排昂贵虚拟 DOM 批量对比、最小化补丁性能更好。Diff 算法原理同层比较不跨层级比对标签不同直接销毁重建标签相同对比属性列表渲染必须加key提升 Diff 效率key 的作用是什么帮助 Diff 算法精准识别节点减少不必要销毁重建不要用 index 做 key会导致列表错乱、输入框状态丢失。函数组件 vs 类组件区别函数组件无生命周期、无this用 Hooks 管理状态类组件有生命周期、this、state 原生支持现在项目全用函数组件HooksState 和 Props 区别Props父传子、只读、不可修改State组件自身私有、可修改单向数据流父改 props 传给子生命周期常用有哪些类组件componentDidMount挂载后发请求componentDidUpdate更新后执行逻辑componentWillUnmount组件销毁清除定时器、监听useEffect 作用函数组件替代生命周期可以模拟挂载、更新、销毁处理副作用请求、定时器、事件监听。useEffect 依赖数组作用空数组只执行一次挂载不传依赖每次渲染都执行传依赖依赖变化才执行useState 原理在函数组件保存状态快照调用更新函数触发重渲染更新是异步批量更新。useRef 作用获取DOM 元素保存不变的值、定时器、不触发渲染的变量useMemo 和 useCallback 作用useMemo缓存计算结果避免重复计算useCallback缓存函数引用防止子组件不必要重渲染都是性能优化组件通信方式父子props / 回调函数跨层useContext 全局上下文任意组件Redux / Zustand / 事件总线Context 是什么跨层级组件透传数据不用一层一层 props 往下传适合主题、用户信息、全局配置。受控组件 vs 非受控组件受控组件value 绑定 state表单值由 React 控制非受控组件用 useRef 获取 DOM 值不受 state 控制React 事件机制React 事件是合成事件不是原生 DOM 事件做了事件委托统一兼容浏览器性能更好。什么是高阶组件 HOC函数接收组件返回新组件用来复用逻辑、权限控制、日志埋点现在多用 Hooks 替代。

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价