第3章 页面生命周期与数据流
生命周期与数据流是小程序开发的核心基础，面试中高频考察对执行顺序、数据通信方式及状态管理方案的理解。掌握本章内容，能系统应对从基础原理到工程实践的各类问题。
📋 生命周期执行顺序详表
| 生命周期 | 触发时机 | 典型用途 | 执行次数 |
|---|---|---|---|
| onLoad | 页面首次加载 | 数据初始化、请求接口 | 1次 |
| onShow | 页面每次显示 | 数据刷新、统计上报 | 多次 |
| onReady | 页面渲染完成 | DOM操作、动画启动 | 1次 |
| onHide | 页面切换到后台 | 暂停任务、保存状态 | 多次 |
| onUnload | 页面卸载 | 清理资源、取消订阅 | 1次 |
🎯 面试问题1：请描述小程序页面的生命周期，并说明执行顺序。
面试官考察点：基础掌握程度、生命周期理解深度、是否能结合实际场景说明差异。
回答框架：总述生命周期阶段 → 按顺序列举并说明触发时机 → 强调关键差异（onLoad只执行一次 vs onShow多次） → 结合实际场景（数据刷新放在onShow）。
示例回答：小程序页面生命周期包括onLoad、onShow、onReady、onHide、onUnload。首次加载顺序：onLoad→onShow→onReady；页面切换触发onHide，返回触发onShow。onLoad只执行一次适合初始化，onShow每次可见时触发适合数据刷新，onReady适合DOM操作。
可能追问：冷启动与热启动的差异？页面栈超过5层时生命周期如何变化？onLoad中异步请求未完成页面已onShow如何处理？
避坑提醒：❌ 不要将数据刷新放在onLoad中导致返回页面不更新；❌ 不要混淆App生命周期（onLaunch/onShow/onHide）与Page生命周期。
🎯 面试问题2：小程序页面之间如何传递数据？有哪些方式？
面试官考察点：数据流方案掌握度、方案对比能力、选型思维、边界情况处理。
回答框架：分类列举传递方式 → 对比优劣（数据量/安全性/复杂度） → 选型建议 → 实际案例。
示例回答：常用四种方式：1）URL参数传递，适合简单数据；2）全局变量App.globalData，适合共享状态；3）Storage存储，适合持久化数据；4）getCurrentPages页面栈通信，适合复杂交互。根据数据量和场景选择，避免URL传递大对象。
可能追问：传递大量数据时如何优化？页面栈方法的安全性如何保证？全局变量污染如何避免？
避坑提醒：❌ URL参数有长度限制，不要传递复杂对象；❌ Storage不适合高频实时数据；❌ 页面栈方法需谨慎处理页面未加载完成的情况。
📊 数据传递方式对比
| 方式 | 数据量限制 | 安全性 | 实时性 | 推荐场景 |
|---|---|---|---|---|
| URL参数 | 小于2KB | 低（可见） | 即时 | 页面间简单参数 |
| App.globalData | 无限制 | 中 | 即时 | 全局共享状态 |
| Storage | 最大10MB | 高 | 异步 | 持久化配置/缓存 |
| 页面栈通信 | 无限制 | 中 | 即时 | 页面间复杂交互 |
| EventBus | 无限制 | 中 | 即时 | 跨页面事件通知 |
🎯 面试问题3：小程序如何进行全局状态管理？有哪些方案？
面试官考察点：状态管理意识、工程化能力、方案选型经验、对第三方库的了解。
回答框架：指出问题背景 → 列举主流方案 → 对比分析（适合场景/复杂度） → 推荐实践 + 理由。
示例回答：主流方案：1）App.globalData+监听器，适合简单场景；2）MobX或Redux，适合复杂状态；3）自定义EventBus，适合跨页面通信。我推荐中小项目用globalData+观察者模式，大项目引入MobX保持状态可预测性和可维护性。
可能追问：MobX和Redux在小程序中的差异？如何避免状态污染？状态管理性能优化策略？
避坑提醒：❌ 不要过度设计状态管理，小程序页面层级有限；❌ 避免全局变量命名冲突；❌ 第三方库注意兼容性和包体积。
🏗️ 项目案例：电商小程序「速购优选」
| 项目名称 | 速购优选 — B2C电商小程序 |
| 业务背景 | 支持商品浏览、加入购物车、下单支付、订单管理，需多个页面间保持购物车数据实时同步。 |
| 规模指标 | 日活 12万+，页面数 35+，月交易额 500万+，购物车 QPS 峰值 2000+ |
| 技术栈 | 微信小程序原生 + MobX 状态管理 + 云开发数据库 + 自定义导航组件 |
| 核心难点 | ① 商品详情页与购物车 Badge 实时同步；② 多页面间数据一致性（首页/详情页/购物车页/订单页）；③ 页面栈深度超过 8 层时的管理策略。 |
| 面试高频追问 | 如何保证购物车数据在多个页面间实时同步？页面栈超过 10 层如何处理？MobX 的 autorun 是否会造成性能浪费？ |
| 可迁移回答话术 | 采用「全局状态池 + 按需更新」策略：购物车数据统一存储在 MobX Store 中，每个页面通过 autorun 监听变化自动更新视图；页面栈管理使用事件队列，超过 8 层时引导用户返回首页，避免性能衰减。 |