小程序面试题收集

1.请谈谈微信小程序主要目录和文件的作用

• project.config.json：项目配置文件，用的最多的就是配置是否开启https校验
• App.js：设置一些全局的基础数据等
• App.json：底部tab，标题栏和路由等设置
• App.wxss：公共样式，引入iconfont等
• pages：里面包含一个个具体的页面
• index.json：配置当前页面标题和引入组件
• index.wxml：页面结构
• index.wxss：页面样式表
• index.js：页面的逻辑，请求和数据处理

2.请谈谈wxml与标准的html的异同

• 都是用来描述页面的结构
• 都由标签，属性等构成
• 标签名字不一样，且小程序标签更少，单一标签更多
• 多了一些 wx:if 这样的属性以及{{}} 这样的表达式
• WXML仅能在微信小程序开发者工具中预览，而HTML可以在浏览器内预览
• 组件封装不同，WXML对组件进行了重新封装
• 小程序运行在JSCore中，没有DOM树和window对象，小程序中无法使用DOM和window，也不能使用NPM包

3.请谈谈WXSS和CSS的异同

• 都是用来描述页面的样式
• WXSS具有CSS大部分的特性，也做了一些扩充和修改
• WXSS新增了尺寸单位，WXSS在底层支持新的尺寸单位rpx
• WXSS仅支持部分CSS选择器
• WXSS提供全局样式和局部样式

4.怎么封装微信小程序的数据请求

• 在根目录下创建util目录及api.js文件和apiConfig.js
• 在apiConfig.js封装基础的get，post和put，upload等请求方法，设置请求体，带上token和异常处理等
• 在api中引入apiConfig.js封装好的请求方法，根据页面数据请求的urls，设置对应的方法并导出，在具体的页面中导入；或将所有的接口放在统一的js文件中并导出
• 在app.js中创建封装请求数据的方法
• 在子页面中调用封装的请求数据

5.小程序页面之间有哪些(传值)传递数据的方法？

• 使用全局遍历实现数据传递
• 页面跳转或重定向时，使用url带参数传递数据
• 使用组件模板template传递参数
• 使用缓存传递参数
• 使用数据库传递参数
• 给html元素添加data-*属性来传递值，然后通过e.currentTarget.dataset或onLoad的params参数获取
• 设置id的方法标识来传值，通过e.currentTarget.id获取设置的id值，然后通过设置全局对象的方式来传值
• 在navigator中添加参数数值

6.请谈谈小程序的双向绑定和vue的异同

大体相同，但小程序之间this.data的属性是不可以同步到视图的，必须调用this.setData()方法

7.请谈谈小程序的生命周期

分为页面生命周期和应用生命周期

页面生命周期：

• onLoad：页面加载时触发，只会调用一次，可获取当前页面路径汇总的参数
• onShow：页面显示/切入前台时触发，一般用来发送数据请求
• onReady：页面初次渲染完成时触发，只会调用一次，代表页面已可以和视图层进行交互
• onHide页面隐藏/切入后台时触发，如底部tab切换到其他页面或小程序切入后台等
• onUnload：页面卸载时触发，如redirectTo或navigateBack到其他页面

8. 分析微信小程序的优劣势

优势：

• 容易上手，基础组件库比较全，基本不需要考虑兼容问题
• 开发文档比较完善，开发社区比较活跃，支持插件式开发
• 良好的用户体验
• 开发成本比APP要低
• 为用户提供良好的保障

劣势：

• 限制较多，页面大小不能超过1M，不能打开超过5个层级的页面
• 样式单一，部分组件已经是成型的，样式不可修改
• 推广面窄
• 依托与微信，无法开发后台管理功能
• 后台调试麻烦，因为api接口必须https请求且公网地址
• 甄姬测试，个别安卓和苹果表现迥异

9.微信小程序和H5的区别

• 运行环境不同
• 开发成本不同
• 获取系统权限不同
• 应用在生成环境的运行速度流程

10. bindtap 和 catchtap的区别

• bind事件不会阻止冒泡事件向上冒泡（事件冒泡）
• catch事件绑定可以阻止冒泡事件向上冒泡（事件委托）

11.简述wx.navigateTo(),wx.redirectTo(),wx.switchTab(),wx.navigateBack(),wx.reLanuch()的区别

• 在 wxml 页面中：跳转新页面，在当前页面打开，切换到首页tab
• 在 js 页面中：分为应用内的页面和tabBar的页面
• 如果上述跳转遇到跳转失败或者无效的问题，请访问：wx.navigateTo/wx.redirectTo无效

12.哪些方法可以用来提高微信小程序的应用速度

1. 提高页面加载速度
2. 用户行为预测
3. 减少默认data的大小
4. 组件化方案