微信小程序基础

1、小程序的优势和劣势有哪些？
优势：

1微信助力更加容易推广，入口众多。在微信中，小程序拥有众多入口，例如附近的小程序、小程序码、分享、发现-小程序等五十多个的入口。这些入口有助于企业更好的获取流量，从而进行转化、变现。
2使用便捷，无需下载。只需要轻轻点一下就可以使用，更加符合用户对使用方便、快捷的需求，所以小程序的用户数量不断增加。
3体验良好，有接近原生app的体验。在微信生态里，小程序在功能和体验上是可以秒杀掉 H5 页面的，H5 页面经常出现卡顿、延时、加载慢、权限不足等原因，而这些问题在小程序里都不会出现。
4成本更低，从开发成本到运营推广成本，小程序的花费仅为APP的十分之一，无论是对创业者还是传统商家来说都是一大优势。

劣势：

单个包大小限制为2M，这导致无法开发大型的应用，采用分包最大是16M（这个值一直在变化，以官网为准）。
需要像app一样审核上架，这点相对于H5的发布要麻烦一些。
受微信限制，很多功能无法审核通过。

2、小程序中如何在wxml中绑定JS中的数据？
在小程序中可以通过{{}}加载data中的数据

3、小程序中如何进行条件渲染？
wx:if

wx:elif

wx:else

也可以通过

hidden

4、小程序中如何进行循环渲染？
wx:for=“列表”

wx:for-item=""可以指定每一项的变量名（默认item）

wx:for-index=""可以指定每一项的变量名（默认index）

wx:key=“列表中的某个属性名”

5、wxss和css有什么不同？
WXSS和CSS类似，不过在CSS的基础上做了一些补充和修改

rpx
rpx是响应式像素，可以根据屏幕宽度进行自适应。规定屏幕宽度为750rpx。
那么在不同的手机型号下1rpx=屏幕宽度/750
iphone6下1rpx = 0.5px
@import 来导入别的wxss

6、小程序中的JS与浏览器中有什么不同？
浏览器中：

ES、dom、bom

微信小程序中：

ES、微信小程序框架、微信小程序API

7、小程序中如何设置全局的数据，怎么获取这些数据？
可以在app中设置全局数据
在任何地方可以同getApp()拿到app实例

8、小程序中的生命周期函数有哪些？
App的
onLaunch
onShow
onHide
onError
页面的:
onLoad
onReady
onShow
onHide
onUnLoad
onPullDownRefresh
onReachBottom
onPageScroll
onShareAppMessage

9、怎么封装小程序的数据请求？
目的
为了给所有的接口请求添加统一的配置，避免每次请求的时候指定配置
可以添加统一的请求拦截器和响应拦截器，在调用接口的时候做一些通用的处理
如何封装
创建一个request的JS模块
在这个模块里封装wx.request请求，通过Promise解决异步问题
在发送请求之前可以添加统一的请求头
在响应数据之前可以进行统一的逻辑处理

10、小程序中如何定义事件？
通过bind可以绑定事件

bind:tap=“执行函数” : 通过bind:tap绑定点击事件

11、如何阻止事件冒泡？如何设置事件在捕获阶段触发？
阻止事件冒泡
通过catch绑定事件
在事件捕获阶段触发
通过capture-bind绑定事件
12、简述一下小程序中常见的界面跳转的方式，以及区别？
wx.navigateTo:
保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层
wx.switchTab：
跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面
wx.reLaunch
关闭所有页面，打开到应用内的某个页面
wx.redirectTo
关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。
wx.navigateBack
关闭当前页面，返回上一页面或多级页面。

13、小程序中如何修改data上的数据？
如果修改了data上的数据需要触发界面刷新的话，需要调用this.setData方法

14、简述一下小程序的通讯模型？
小程序的渲染层和逻辑层分别由2个线程管理：渲染层的界面使用了WebView 进行渲染；逻辑层采用JsCore线程运行JS脚本。一个小程序存在多个界面，所以渲染层存在多个WebView线程，这两个线程的通信会经由微信客户端（下文中也会采用Native来代指微信客户端）做中转，逻辑层发送网络请求也经由Native转发。
渲染层和逻辑层的关系
渲染层的渲染和逻辑层的数据相关。
逻辑层负责产生、处理数据。
逻辑层通过 Page 实例的 setData 方法传递数据到渲染层。

15、小程序中如何进行本地存储？
存储数据
wx.setStorage : 异步
wx.setStorageSync ： 同步
获取数据
wx.getStorage: 异步
wx.getStorageSycn: 同步
16、小程序中界面跳转如何传递参数？如何获取这些参数？
传参：
通过？拼接参数
获取参数：
通过跳转界面onLoad方法的options参数可以获取到路由传参
17、小程序中如何进行父子组件传参
父组件向子组件传值
通过properties属性声明这些变量
引用组件的时候直接在标签里填写这些属性即可
子组件向父组件传值
通过组件实例的 triggerEvent方法进行传递
this.triggerEvent(“事件名”,数据)
父组件可以通过事件的detail获取子组件传递过来的数据

18、小程序中组件都有哪些生命周期函数
lifetimes字段下

生命周期 参数 描述 最低版本
created 无 在组件实例刚刚被创建时执行 1.6.3
attached 无 在组件实例进入页面节点树时执行 1.6.3
ready 无 在组件在视图层布局完成后执行 1.6.3
moved 无 在组件实例被移动到节点树另一个位置时执行 1.6.3
detached 无 在组件实例被从页面节点树移除时执行 1.6.3
error Object Error 每当组件方法抛出错误时执行

pageLifetimes

生命周期 参数 描述 最低版本
show 无 组件所在的页面被展示时执行 2.2.3
hide 无 组件所在的页面被隐藏时执行 2.2.3
resize Object Size 组件所在的页面尺寸变化时执行 2.4.0

19、谈谈你关于组件封装的心得
目的：
在开发项目的过程中经常遇到有些界面的UI元素是可以复用的，这个时候可以考虑把这些UI元素抽象成组件
在开发过程中也会发现有些界面比较复杂，写起来比较麻烦，而且，单个文件的代码量过多也不利于后期维护，这是就可以按照功能拆分之前的界面元素，每个组件单独维护这个组件的功能，将复杂的问题拆解成一个个小问题，提高了代码的可维护性。
怎么做：
将指定的组件抽象，首先会先对组件进行静态界面的还原，之后需要考虑一下问题
组件是否需要通过外界传递一些样式进来。（组件是否在不同的地方有不同的表现形式）
组件是否需要插槽，是否需要命名插槽
组件哪些数据是需要从父组件传递进来的，这些数据是什么类型，是否需要默认值
组件本身需要包含哪些事件，这些事件有哪些参数
举个自己封装的例子…
20、如何提高小程序的加载速度
精简代码，降低WXML结构和JS代码的复杂性；
合理使用setData调用，减少setData次数和数据量
必要时使用分包优化
减少在代码包中直接嵌入的资源文件。尽量使用线上的链接。

21、 谈谈你对websocket的理解
回答类似的面试题可以按照如下的套路来回答。

先说是什么？

然后说这个协议可以解决什么问题？

举一个实际的例子

websocket是HTML5新出的一个网络协议,全双工通讯协议。

它的最大特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话，属于服务器推送技术的一种。
http只能是单向发起的，只能由客户端主动发起，服务端被动响应。服务端无法主动向客户端发送消息，如果想实现类似于聊天室这种即时通讯的功能，就需要使用消息轮询。轮询的效率低，比较消耗资源。(每次建立http连接都进行三次握手，并且每次请求都需要携带请求头)。通过websocket协议，一旦建立连接之后，客户端可以向服务端发送消息，服务端也可以主动向客户端推送消息了。

22、WXML 提供两种文件引用方式import和include的区别

	import只引用模板,include引用除模板以外的

23、小程序开放能力有哪些些，举例说明

	扫码,分享,摄像头

24、谈谈你对http请求登录鉴权的理解

	小程序没有header,需要手动存储cookie在缓存中,每次需要时和cookie发送服务端

25、如何实现下拉刷新和触底加载更多