重点
- 说说对React中类组件和函数组件的理解！有什么区别！
- React 中组件之间如何通信！
- React 组件的生命周期可分为哪些阶段！
- React 和 DOM 事件处理的区别是！
- 说说react中引入css的方式有哪几种！区别！
- 什么是Redux！请简要解释Redux的核心概念。
- 说说React服务端渲染怎么做！原理是什么！
八股文
认识
- 对比 React 和 Vue ！
- 说说对 React 的理解！有哪些特性！
- 什么是声明式编程！
- 说说你对函数式编程的理解！优缺点！
- 介绍一下 MVVM 模式，和 MVC 模式有什么区别！
- 如何组织 React 项目文件结构！
- React 18 都有哪些新特性！
JSX
- 什么是 JSX ！
- 为什么推荐在 React 中使用 JSX ！
- 为什么 JSX 可以有效降低 XSS 风险！
- 如何在 JSX 中条件渲染！
- 如何在 JSX 中循环控制！
- 为什么 JSX 中 class 变成了 className ！
组件
- 什么是 React 组件！
- React 组件分成哪几类！
- 说说对React中类组件和函数组件的理解！有什么区别！
- 说说对受控组件和非受控组件的理解！应用场景！
- 说说对高阶组件的理解！应用场景！
- 什么是 Pure Components ！
- 展示组件和容器组件的区别是！
- 如何劫持 React 组件提高组件复用度！
- 如何设计一个 React 组件！
- React 组件与 Web Components 共存的最佳实践是！
- React构建组件的方式有哪些！区别！
状态
- 什么是 React 的状态！
- 什么是 React 的状态提升！
- state 和 props 有什么区别！
- 如何创建动态的状态名称！
- 如何优化 setState，减少不必要更新！
- 当 State 值为 Object 时，如何优化！
属性
- 什么是 React 的属性！
- 为什么不能直接修改属性！
- 通过属性传递组件本身的方法有哪些！
- 使用 key 属性有哪些注意事项！
- 如何在 React 中进行静态类型检查！
- 如何限制某个属性是必须的！
- 如何设置属性的默认值！
- React 是否支持 HTML 属性！
- React 是否支持自定义属性！
通信
渲染
- React 返回空对象有哪些方法！
- 如何优化不必要的渲染！
- React 如何渲染 HTML ，有什么风险！
- React 为什么要引入基于 Fiber 协调器的异步渲染！
- 说说对Fiber架构的理解！解决了什么问题！
- React Fiber 异步渲染分为哪几个阶段，对应生命周期是什么！
- React中的key有什么作用！
- 说说你对immutable的理解！如何应用在react项目中！
- 说说React render方法的原理！在什么时候会被触发！
- 说说你是如何提高组件的渲染效率的！在React中如何避免不必要的render！
- 说说React diff的原理是什么！
- 说说React Jsx转换成真实DOM过程！
- 说说 React 性能优化的手段有哪些！
生命周期
- 说说 React 生命周期有哪些不同阶段！每个阶段对应的方法是！
- React 组件的生命周期可分为哪些阶段！
- 异步数据请求应在哪些生命周期里调用！
- useEffect useLayoutEffect 与生命周期的对应关系是！
- super() 和 super(props) 有什么区别！
- 对比 React Hook 与生命周期
事件
- 说说React的事件机制！
- React事件绑定的方式有哪些！区别！
- React 和 DOM 事件处理的区别是！
- 如何在 React 事件处理阻止默认行为！
- 如何传参给事件处理函数！
- 如何阻止事件处理函数被频繁调用！
- React 17 对事件处理做了哪些改进！
样式管理
错误边界
Hook
- 说说对React Hooks的理解！解决了什么问题！
- 什么是 State Hook！
- 什么是 Effect Hook！
- 如何清除 Effect Hook 的副作用！
- 使用 Hook 需要遵循的规则是！
- useMemo 和 useCallback 的区别是！
- useReducer 和 useState 的区别是！
- useLayoutEffect 和 useEffect 的区别是！
- useRef 和 Refs 的区别是！
- 说说对React refs 的理解！应用场景！
- 如何自定义 Hook！
- 是否有必要使用 Hook API 重写所有类组件！
- useState 返回更新 state 的函数是同步，还是异步的！
测试
- 什么是 Jest ！
- 如何模拟数据获取！
- 如何模拟组件！
- 如何模拟计时器！
- 如何模拟浅层渲染！
- 如何将组件渲染成 JS 对象！
- 如何模拟 DOM 环境！
- 如何获得测试代码覆盖率！
- 如何测试 React Router！
原理
- 说说 Real DOM 和 Virtual DOM 的区别！优缺点！
- 说说 React中的setState执行机制
- Vue2、Vue3、React之间的diff算法区别是什么！
- 什么是 React Concurrent 模式！
- 什么是 Suspense ！
- React 如何定义任务的优先级！
Redux
- 什么是Redux！请简要解释Redux的核心概念。
- 在Redux中，什么是Action！
- Redux中的Reducer是什么！它的作用是什么！
- 如何创建一个Redux Store！
- 如何在React应用中使用Redux！
- Redux中的异步操作如何处理！
- 什么是Redux中的中间件！请举例说明常用的Redux中间件。
- Redux中的连接器（Connector）是什么！它的作用是什么！
- Redux中的Action和Reducer之间的关系是怎样的！
- 如何在Redux中处理多个Reducers的数据流！
- Redux的工作流程是怎样的！
- 在Redux中，什么时候应该使用action creators！
- Redux中的状态持久化是如何实现的！
- 在Redux中，什么是Redux DevTools以及它的作用是什么！
- 说说你对Redux的理解！其工作原理！
- 说说对Redux中间件的理解！常用的中间件有哪些！实现原理！
- Flux 和 Redux 的区别是！
- Redux 的核心原则是！
- React Context 和 Redux 的区别是！
- React 访问 ReduxStore 的方法有哪些！
- Redux 中异步请求数据时发送多 Action 方法有哪些！
- 如何判断项目需要引入 Redux ！
- 你在React项目中是如何使用Redux的！ 项目结构是如何划分的！
- 手写一个 redux-thunk ！
路由
Next. js
- 说说React服务端渲染怎么做！原理是什么！
- 什么是 Next.js ！
- Next.js 预渲染有哪些形式！
- 为什么 Next.js 要重新设计一套路由！
- Next.js 中获取数据有哪些方法！
- 如何在 Next.js 中为静态资源配置 CDN ！