微信小程序面试题

最近开始学习微信小程序，初步掌握了应用小程序在项目中的业务开发，但还是感觉有很多需要掌握的原理等知识点，所以就通过面试题来总结一下吧。（本菜鸟比较懒，之后有时间再慢慢写。。。）

一、小程序中有几种文件？

• json文件：json是一种数据格式，并不是编程语言，在小程序中，它扮演的是静态配置的角色。常见的json文件有3种：

  • 小程序配置app.json：做全局配置；

  • 页面配置page.json：对小程序具体页面的配置；

  • 工具配置project.config.json：对开发者工具的个性化配置，如域名校验、代码上传时自动压缩等（参考项目配置文件 | 微信开放文档）。

• WXML模板：全称（WeiXin Markup Language） 微信标记语言 ，结合小程序的基础组件、事件系统，可以构建出页面的结构。

• WXSS：（WeiXin Style Sheets） 小程序的样式语言，用于描述wxml的组件的视觉效果，就相当于网页的css。
• JavaScript脚本语言：逻辑处理，网络请求。

 

二、小程序中的自定义事件，如何传值到js？

通过data-key实现，key的名称可以自定义。

在js中通过event参数获取，event.currentTarget.dataset.key。

注意：key不允许大写，不可以存放对象，有两种支持的写法：

• data-element-type ，最终会呈现为：event.currentTarget.dataset.elementType ；
• data-elementType ，最终会呈现为 event.currentTarget.dataset.elementtype 。

 

三、wxss和css有无不同？

为了适应广大的前端开发者，WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序，WXSS 对 CSS 进行了扩充以及修改。

与 CSS 相比，WXSS 扩展的特性有：

• 尺寸单位：支持rpx，可以根据屏幕宽度进行自适应，规定屏幕宽度为750rpx；
• 样式导入：使用@import语句可以导入外联样式表，@import后跟需要导入的外联样式表的相对路径，用;表示语句结束。

区别：

• wxss 中的本地资源图片无法通过 WXSS 获取，可以使用网络图片，或者 base64，或者使用<image/>标签。

 

四、小程序关联微信公众号如何确定用户的唯一性？

在小程序中有openid、union_id

openid是同一用户同一应用唯一；

union_id是同一用户不同应用唯一。

所以，想要确定用户的唯一性，只能用union_id。

使用 wx.getUserInfo方法 withCredentials 为 true 时 可获取 encryptedData，里面有 union_id。后端需要进行对称解密

五、小程序页面的生命周期

页面生命周期首先考虑三个事件：

• 监听页面初次加载：onLoad，在页面没被销毁之前只会触发1次，可以在onLoad 的参数中获取打开当前页面路径中的参数；

• 监听页面显示：onShow，页面显示/切入前台时触发；

• 监听页面初次渲染完成：onReady，在页面没被销毁前只会触发1次，代表页面已经准备妥当，可以和视图层进行交互。

页面显示后，随着用户的操作，还会触发其他事件：

• 监听页面隐藏：onHide，页面隐藏/切入后台时触发，wx.navigateTo切换到其他页面、底部tab切换时触发；

• 监听页面卸载：onUnload，返回到其它页时，wx.redirectTo或wx.navigateBack使当前页面被微信客户端销毁回收时触发。