小程序的面试题

小程序的生命周期:

  • onLoad() 页面加载时触发,只会调用一次,可获取当前页面路径中的参数。
  • onShow() 页面显示/切入前台时触发,一般用来发送数据请求;
  • onReady() 页面初次渲染完成时触发, 只会调用一次,代表页面已可和视图层进行交互。
  • onHide() 页面隐藏/切入后台时触发, 如底部 tab 切换到其他页面或小程序切入后台等。
  • onUnload() 页面卸载时触发,如redirectTo或navigateBack到其他页面时。
  • onPullDownRefresh() 下拉刷新的钩子函数 用户下拉刷新时会自动走到这个函数中
  • onReachBottom() 上翻到底的钩子函数

本质就是一个单页面应用,所有的页面渲染和事件处理,都在一个页面内进行,但又可以通过微信客户端调用原生的各种接口;

  • 它的架构,是数据驱动的架构模式,它的UI和数据是分离的,所有的页面更新,都需要通过对数据的更改来实现;
  • 它从技术讲和现有的前端开发差不多,采用JavaScript、WXML、WXSS三种技术进行开发;
  • 功能可分为webview和appService两个部分;
  • webview用来展现UI,appService有来处理业务逻辑、数据及接口调用;
  • 两个部分在两个进程中运行,通过系统层JSBridge实现通信,实现UI的渲染、事件的处理等。

小程序的双向绑定和vue的异同

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

微信小程序怎么进行双向绑定

  1. 通过bind-tap点击事件 向app.js 定义的方法中获取回执
  2. 设置data的值 实现双向绑定

小程序之间的页面传值:

  1. 设置id的方法标识来传值,通过e.currentTarget.id获取设置的id的值,然后通过设置全局对象的方式来传递数值
  2. 在navigator中添加参数数值
  3. getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。 

封装微信小程序的数据请求的?

  1. 将所有的接口放在统一的js文件中并导出
  2. 在app.js中创建封装请求数据的方法
  3. 在子页面中调用封装的请求数据
  4. 使用全局变量实现数据传递
  5. 页面跳转或重定向时,使用url带参数传递数据
  6. 使用组件模板template传递参数
  7. 使用缓存传递参数
  8. 使用数据库传递参数

微信支付的 流程是否可以简单说一下?

  • 临时凭证 获取 wxid
  • 生成repayid
  • json,返回给小程序,小程序调支付窗口。
  • 支持成功提示 + POST回调。

 

如何自定义tabbar?

创建一个compent文件夹,里面创建一个tabbar页面,取消原有的tabbar页面。需要在app.json中输入compent:ture,在自定义的pages页面中写入<tabbar selected="{{0}}"></tabbar>进行选中效果显示
<think>好的,我需要处理用户关于小程序面试题的请求。首先,用户希望得到结构清晰的回答,分点说明,并且使用中文。同时,他们提到了系统级指令,需要确保数学表达式的格式正确,使用$...$和$$...$$,并且LaTeX语法无误。 首先,我需要确定用户的具体需求。他们可能正在准备小程序开发的面试,需要了解常见的面试题及其解答。因此,我应该整理常见的小程序面试问题,涵盖基础概念、框架使用、性能优化、安全等方面,确保内容全面且实用。 接下来,考虑如何组织回答结构。按照常见的分类方式,将问题分为几个大类,如基础概念、框架使用、性能优化、安全等,每个类别下列举典型问题并给出简洁解答。这有助于用户逐步理解,符合用户要求的结构清晰。 在编写每个问题和解答时,需要注意使用正确的中文表达,同时检查是否有数学表达式需要处理。例如,如果有关于计算或公式的地方,要使用$...$包裹,如版本号比较$1.2.3 > 1.1.9$。如果有独立公式,比如性能优化的计算公式,可能需要使用$$...$$,但根据常见问题,可能这类数学内容不多,但需保持警惕。 还需要确保LaTeX语法正确,比如积分符号\int的正确使用,上下标的位置等。同时,用户要求回答真实可靠,因此需要基于小程序开发的常见面试题和最佳实践来组织内容,避免错误信息。 可能的问题点包括:是否覆盖了主要的小程序平台(如微信、支付宝),是否涉及最新的API或更新,是否涵盖常见的性能优化策略等。需要确保每个解答简洁准确,不冗长,但信息完整。 最后,检查整个回答是否符合用户提供的系统级指令,特别是数学表达式的格式是否正确,以及结构是否清晰。确保没有使用任何Markdown格式,纯文本分点,使用数字和缩进层次分明。</think>以下是小程序开发常见面试题及解答,按类别整理,帮助您系统准备: --- ### 一、基础概念 1. **小程序与H5的区别** - **运行环境**:H5运行在浏览器,小程序运行在专属环境(如微信JSCore) - **性能**:小程序加载更快,支持原生组件(如地图、摄像头) - **权限**:小程序需通过平台审核,调用系统API更直接(如支付、扫码) 2. **小程序生命周期函数** - `onLoad()`:页面加载时触发 - `onShow()`:页面显示时触发 - `onReady()`:页面初次渲染完成 - `onHide()`:页面隐藏 - `onUnload()`:页面销毁 --- ### 二、框架与语法 3. **WXML与HTML差异** - WXML使用`<view>`替代`<div>`,支持数据绑定`{{}}` - 特有指令:`wx:if`, `wx:for`, `wx:key`实现条件渲染与列表循环 - 示例:渲染列表 ```html <view wx:for="{{list}}" wx:key="index">{{item.name}}</view> ``` 4. **WXS的作用** - 在WXML中执行JavaScript逻辑,如过滤数据: ```javascript // 过滤价格超过100的商品 function filterPrice(products) { return products.filter(p => p.price > 100) } ``` --- ### 三、性能优化 5. **首屏加载优化方案** - 分包加载:主包≤2MB,总包≤20MB(微信规则) - 代码压缩:开启`minify`选项,删除无用代码 - 数据预拉取:使用`wx.request`提前获取数据 6. **setData的正确使用** - **问题**:频繁调用导致渲染卡顿 - **解决**:合并数据更新,避免单次传输超过$1024\text{KB}$ ```javascript // 错误写法:多次调用 this.setData({ a: 1 }) this.setData({ b: 2 }) // 正确写法:合并更新 this.setData({ a: 1, b: 2 }) ``` --- ### 四、网络与安全 7. **如何防止请求被劫持?** - 启用HTTPS协议 - 敏感数据加密(如AES加密用户ID) - 校验服务器证书指纹 8. **登录流程设计** 1. 调用`wx.login()`获取临时`code` 2. 发送`code`到服务端换取`openid`和`session_key` 3. 服务端返回自定义登录态(如Token) 4. 客户端存储Token用于后续请求 --- ### 五、调试与发布 9. **版本号规范** - 格式:`主版本.次版本.修订号`(语义化版本控制) - 示例:修复BUG时升级为$1.0.1 \rightarrow 1.0.2$ - 比较规则:$1.2.3 > 1.1.9$ 10. **灰度发布流程** - 上传代码后,在管理后台设置“体验版” - 选择特定用户或百分比逐步开放 - 监控错误率与性能指标,确认稳定后全量发布 --- ### 六、开放能力 11. **如何调用摄像头扫码?** ```javascript wx.scanCode({ success(res) { console.log('扫码结果:', res.result) } }) ``` 12. **订阅消息实现步骤** 1. 在后台配置订阅模板 2. 调用`wx.requestSubscribeMessage()`请求用户授权 3. 通过服务端API发送消息(需模板ID和用户openid) --- **建议准备方向**: - 重点掌握微信小程序API(如路由、存储、设备API) - 理解小程序底层原理(双线程模型、通信机制) - 准备实际项目经验描述(优化案例、技术难点)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值