小程序、uniapp、原生微信小程序高频面试题总结（一）

1. 什么是小程序

小程序是一种轻量级的应用程序，可以在手机等设备上运行，而无需用户下载和安装。它结合了移动应用程序的功能和网页应用程序的便捷性，允许用户在一个封闭的环境中直接使用应用程序。特点：无需下载安装；轻量级；跨平台兼容；互联网便携；

2.小程序和传统网页应用程序的区别是什么

1. 安装和访问：传统web需要输入url地址进行网页的访问，而小程序通过扫描二维码和搜索进行访问并且不需要进行安装
2. 功能和能力：小程序除了能和浏览器一样调用设备信息等接口，还具有蓝牙，定位等接口的调用，用户的交互性大大提高，而传统web受限于网页浏览器并不具备小程序的上述功能
3. 数据存储与缓存：小程序使用的是本地缓存，提供更好的用户体验，而网页应用程序是使用的浏览器的缓存机制进行数据的缓存，有一定的局限性
4. 跨平台兼容性强：uniapp开发的项目可以在多个平台进行发布使用，而传统网页应用程序需要考虑不同版本的浏览器进行兼容和测试，开发繁琐

3.常见的小程序框架

1. 微信小程序框架：基于WXML, WXSS, JavaScript的开发框架
2. 支付宝小程序框架: 基于AXML，ACSS，JavaScript的开发框架
3. 百度小程序框架：基于Swan，Csss，JavaScript的开发框架

4.小程序实现页面跳转的方式

1. navigator组件

// 使用自带的原生组件navigator
<navigator url="/pages/index/index">点击跳转</navigator>

2. API [wx.navigatorTo、wx.redirectTo、wx.reLaunch、wx.switchTab]
   1. wx.navigatorTo: 点击跳转页面会将当前页面加入页面栈中进行存储，可以使用返回按钮返回上一页，同时可以进行页面的传参，在onLoad里面接收参数
   2. wx.redirectTo: 点击跳转页面之后上一页会被卸载掉，不能进行返回，页面栈中只会保留当前页
   3. wx.reLaunch: 关闭当前的所有页面，创建新的页面栈，跳转之后的页面会被设定为新的栈顶页面
   4. wx.switchTab: 专门用于跳转到tabbar页面，会关闭其他的非tabbar页面，不能进行传参
   5. wx.navigataBack: 用于返回上一页使用

5.小程序实现页面传参的方式

1. url传参
   该方法可以在搭配navigatorTo进行页面跳转的时候在后面拼接上需要传递的参数，常用于传递id等值，如果目标页面需要进行详情的数据渲染，当前页面就是详情页的所有数据，如果数据较少的情况下可以直接转为json格式的数据直接拼接到url地址后面进行传递，这适用于数据量较少的情况下，相反还是使用vuex或者浏览器缓存进行传递
2. 全局参数
   原生小程序可以在app.js文件中的APP({…})定义全局的数据进行共享使用，数据是以对象的方式进行存储，如果哪个页面需要就调用getApp().变量名 就可以获取到这个全局变量进行使用

// app.js
App({
   
	name: 'xiaowu',
	age: 20
})

// 目标页面
...
let name = getApp().name;
let age = getApp().age;
...

3. 浏览器缓存
   使用wx.setStorageSync(key, value)将目标页面需要的数据存储到本地浏览器缓存中，在目标页面使用getStorageSync(key)的方式将数据又重缓存中读取出来，一般用于存储token，详情信息等
4. vuex/pinia
   如果你的项目使用到了vue框架，可以用vuex、pinia进行数据的统一状态管理，哪个页面需要该数据直接调用getter就行，极大的方便统一的管理和调用
5. 事件绑定
   适用于父子组件间的数据传输和通信，子组件通过this.$emit(name, value)方法传递数据给父组件，父组件在子组件上自定义一个事件，就可以监听并接收子组件传递过来的数据

6.小程序的生命周期钩子函数

1. onLaunch: 只在小程序启动的时候加载，全局只会执行一次
2. onLoad: 只要页面一加载的时候就会执行，比较常用，可以用来url传递过来的参数；调用方法等；
3. onReady: 监听页面初次渲染完成的时候调用
4. onShow / onHide: 进入当前页面触发 、 离开当前页面触发
5. onError: 小程序发生错误时触发，比如api调用失败
6. onShareAppMessage：点击分享时触发
7. onUnload: 页面卸载的时候触发

7. 小程序性能优化的方法

1. 减少http的请求
   将请求到的数据进行缓存或者进行状态统一管理，可以减少http的请求
2. 使用缓存或者框架的统一状态管理工具（vuex, pinia)
3. 使用异步请求，避免回调地狱
4. 图片懒加载
   -uniapp可以使用自带的image组件的lazy-load属性但是只能在page页面和scroll-view组件中的image使用，也可以使用外部插件
   -原生小程序可以使用节点布局相交状态 IntersectionObserver 这个api来判断是否是否出现在页面可视区实现图片的懒加载

// index.wxml
<view wx:for="{
   {imageList}}"