微信小程序的常见面试题？

<think>好的，我现在需要准备回答关于微信小程序的常见面试题。首先，我应该回忆一下微信小程序的基础知识，比如它的生命周期、文件结构、常用API等。然后，可能需要比较小程序和普通网页应用的区别，比如运行环境、技术栈。接着，性能优化方面，用户可能关心如何提升小程序的加载速度和运行效率。数据传递和通信机制，比如页面间传参、全局变量和缓存的使用。还有网络请求相关的，比如如何封装wx.request，处理异步操作。另外，跨平台开发也是一个常见问题，比如使用Taro或Uni-app的经验。安全方面的问题，比如如何防止XSS攻击，保护用户数据。最后，实际开发中遇到的挑战和解决方案，以及项目经验。需要确保每个问题点都覆盖到，并且用清晰的中文表达，避免技术术语混乱，同时结合实例说明会更生动。还要注意面试题通常不仅考察知识点，还考察解决问题的思路，所以可能需要举一些实际场景的例子。现在整理这些内容，分点列出，结构清晰，便于用户理解和记忆。</think>以下是微信小程序常见面试题及简要解析，帮助系统化梳理核心知识点： --- ### 一、基础概念 1. **小程序与H5的区别** - **运行环境**：H5运行在浏览器，小程序运行在微信环境（双线程架构：渲染层+逻辑层）。 - **性能**：小程序更接近原生体验，支持本地缓存、预加载。 - **API权限**：小程序可直接调用微信原生功能（支付、定位等）。 2. **生命周期** - **应用级**：`onLaunch`（初始化）、`onShow`（前台）、`onHide`（后台）。 - **页面级**：`onLoad`（加载）、`onShow`（显示）、`onReady`（渲染完成）、`onUnload`（卸载）。 - **组件级**：`created`、`attached`、`ready`等。 --- ### 二、核心机制 3. **双线程模型原理** - **逻辑层**（AppService）：处理JS逻辑，与视图层通过`Native`层通信。 - **渲染层**（WebView）：渲染WXML/WXSS，通过`evaluateJavascript`与逻辑层交互。 - **数据传递**：通过`setData`异步更新，需避免频繁调用。 4. **数据通信方式** - **页面传参**：`wx.navigateTo`的`url`拼接参数，通过`onLoad`的`options`接收。 - **全局变量**：`App`对象中定义全局数据。 - **缓存**：`wx.setStorageSync`存储本地数据。 - **事件总线**：自定义事件或使用第三方库（如`mitt`）。 --- ### 三、性能优化 5. **启动速度优化** - 减少代码包体积（分包加载、删除无用代码）。 - 使用`wx.getBackgroundFetchData`预加载数据。 - 启用「按需注入」和「用时注入」减少初始化负载。 6. **渲染优化** - 避免频繁`setData`，合并数据更新。 - 使用`WXS`处理视图层逻辑，减少逻辑层通信。 - 长列表使用`虚拟列表`（如官方`recycle-view`组件）。 --- ### 四、开发技巧 7. **自定义组件封装** - 通过`behaviors`复用代码逻辑。 - 使用`observers`监听数据变化。 - **示例**：封装一个带校验的表单组件，暴露`validate`方法供父组件调用。 8. **网络请求封装** - 统一处理`wx.request`，添加拦截器（请求头、Token、错误码处理）。 - **代码片段**： ```javascript const request = (url, method, data) => { return new Promise((resolve, reject) => { wx.request({ url: `${baseURL}${url}`, method, data, success: (res) => { if (res.statusCode === 200) resolve(res.data); else reject(res); }, fail: (err) => reject(err) }); }); }; ``` --- ### 五、高频进阶问题 9. **如何实现跨平台开发？** - 使用`Taro`、`Uni-app`等框架，通过条件编译兼容不同平台。 - **注意事项**：差异化的API（如微信登录需单独适配H5）。 10. **小程序安全策略** - 防止XSS：对`<rich-text>`渲染内容过滤，避免直接插入未转义HTML。 - 敏感数据保护：登录态（如`openid`）不存储在本地，通过HTTPS传输。 --- ### 六、实战场景分析 **题目**：用户反馈小程序页面白屏，如何排查？ **回答思路**： 1. 检查网络请求是否超时（如接口报错导致数据未加载）。 2. 查看`onLoad`生命周期是否有未捕获的异常。 3. 使用开发者工具的「调试器」查看Console报错信息。 4. 真机测试是否因基础库版本过低导致兼容性问题。 --- 通过以上问题梳理，可系统掌握小程序的核心技术点。实际面试中建议结合项目经验举例说明，如：「在XX项目中，我通过分包加载将启动时间降低了30%」。