React Native 面试题及答案（实战版）.docxVIP

ReactNative面试题及答案（实战版）

一、基础原理与核心概念

RN和原生开发（iOS/Android）的核心区别是什么？实际项目中怎么选择混合开发的场景？

答：核心区别在渲染逻辑和开发效率——RN通过JS引擎（JSC/Hermes）解析JS代码，再通过桥接层（旧架构）/Fabric（新架构）调用原生控件渲染，开发效率高但性能略逊原生；原生开发直接操作平台控件，性能最优但需双端分别开发。

混合场景选择：①已有原生项目需快速迭代新功能（如活动页），嵌RN模块减少双端重复开发；②跨平台需求为主，但核心功能（如支付、地图）需原生实现（RN调用原生模块）；③低性能要求的页面（如设置页、列表页）用RN，高交互页面（如游戏、视频播放）用原生。

Hermes引擎相比默认JSC引擎，实际项目中能解决哪些问题？集成时要注意什么？

答：主要解决三个痛点：①包体积减小（约30%），缓解App下载慢问题；②启动速度提升（预编译字节码），减少白屏时间；③内存占用降低，减少安卓低端机OOM崩溃。

集成注意：①需升级RN到0.64+版本；②部分JS语法兼容问题（如eval函数不支持），需提前排查第三方库；③iOS需开启Bitcode（Xcode设置），安卓需更新NDK版本。

二、组件与生命周期

函数组件中用useEffect模拟类组件的生命周期，实际开发中怎么区分依赖项？举个常见坑点例子

答：依赖项要遵循“用到什么加什么”原则：①空依赖（[]）=componentDidMount+componentWillUnmount；②无依赖=每次渲染后执行；③指定依赖（如[stateA,propsB]）=依赖变化时执行。

常见坑：比如列表页用useEffect请求数据，依赖项漏加setList（状态更新函数），看似没问题，但实际当父组件重新渲染时，setList会重新创建，导致useEffect重复执行（请求重复发送）。解决：要么加setList到依赖，要么用useCallback缓存setList。

FlatList相比ScrollView，什么时候必须用FlatList？优化FlatList滚动卡顿的实战方案有哪些？

答：当列表数据量＞20条时必须用FlatList——ScrollView会一次性渲染所有子组件，数据多了会导致内存暴涨、渲染卡顿；FlatList是懒加载，只渲染可视区域组件。

优化卡顿方案：①设置windowSize={3}（可视区域上下各渲染3屏，默认5，减少渲染量）；②开启removeClippedSubviews={true}（销毁不可见组件，安卓必开）；③子项用React.memo缓存（避免重复渲染）；④图片用resizeMode=cover+懒加载（lazy={true}）；⑤数据量大时加getItemLayout（提前计算子项高度，避免动态计算卡顿）。

三、状态管理与数据流转

Redux、MobX、Context+useReducer三种状态管理方案，实际项目中怎么选？各举一个适用场景

答：①Context+useReducer：适合中小型项目（如工具类App），或局部组件通信（如主题切换），优点是无需额外安装包，缺点是状态多了会导致组件重渲染；

②MobX：适合中大型项目且团队熟悉OOP（面向对象），如电商App的购物车（状态变更频繁，MobX响应式更新更简洁，无需写action/reducer模板代码）；

③Redux：适合大型项目（如社交App）或多人协作，状态流转清晰（action→reducer→store），便于调试（用redux-devtools跟踪状态变化），缺点是模板代码多（可配redux-toolkit简化）。

RN中怎么处理异步数据请求？比如请求接口时的loading、错误提示怎么封装？

答：常用axios+hooks封装：①先写请求基础库（拦截器加token、处理401登录过期）；②用useState管理loading/error状态，useEffect触发请求；

封装示例：

functionuseRequest(url,params){

const[loading,setLoading]=useState(false);

const[data,setData]=useState(null);

const[error,setError]=useState();

constfetchData=async()={

setLoading(true);

try{