微信小程序

1、简单描述下微信小程序的相关文件类型?

   微信小程序项目结构主要有四个文件类型:
    wxml 模板文件,是框架设计的一套标签语言,结合基础组件、事件系统、可以构建出 页面的结构;
    wxss 样式文件,是一套样式语言,用于描述 WXML 的组件样式;
    js 脚本逻辑文件,逻辑处理网络请求;
    json 配置文件,小程序设置,如页面注册,页面标题及 tabBar;
  app.json 整个小程序的全局配置,包括:
    pages: [所有页面路径]
    网络设置(网络超时时间)
    界面表现(页面注册)
    window: {背景色、导航样式、默认标题}
    底部 tab 等
  app.js 监听并处理小程序的生命周期函数、声明全局变量;
  app.wxss 全局配置的样式文件。

2、请谈谈 wxml 与标准的 html 的异同?

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

3、请谈谈 WXSS 和 CSS 的异同?

  都是用来描述页面的样式;
  WXSS 具有 CSS 大部分的特性,但是也做了一些扩充和修改;
  WXSS 新增了尺寸单位,WXSS 在底层支持新的尺寸单位 rpx;
  WXSS 仅支持部分 CSS 选择器;
  WXSS 提供全局样式与局部样式;
  WXSS 不支持 window 和 dom 文档流。

4、怎么封装微信小程序的数据请求?
5、小程序页面间有哪些传递数据的方法?

  在 app.js 中使用全局变量实现数据传递;
  给元素添加 data-*属性来传递值,然后通过 e.currentTarget.dataset 或 onload 的 param 参数获取。 注:data-名称不能有大写字母、不可以存放对象
  通过设置 id 的方法标识来传值,通过 e.currentTarget.id 获取设置的 id 的值,然后通过设置全局对象的方式来传递数值;
  页面跳转或重定向时,在 navigator 中使用 url 带参数传递数据;
  使用组件模板 template 传递参数;
  使用缓存传递参数;
  使用数据库传递参数。

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

  两者大体相同,但小程序直接使用 this.data 属性是不可以同步到视图的,必须调用 this.setData()方法。
  双向绑定
    vue 默认支持双向绑定;
    微信小程序需要借助 data 来实现。
  取值:
    vue 中,通过 this.xxx 取值;
    小程序中,通过 this.data.xxx 取值。
  定义方法:
    小程序定义方法在 page.js 中直接定义即可;
    vue 的方法通过写在 method 中进行定义。
  取变量:小程序通过 wx:for = "{{ lists }}";Vue 是 v-for = "item in lists";
  调用 data 模型(赋值):
    小程序:this.data.item 需要调用 this.setData({item:1}) 进行赋值
    vue: this.item 调用 this.item = 1 赋值
  小程序的双向绑定原则上来说并不是真正的双向绑定。如果在小程序 .js 文件中改变了某个变量的值,那么页面上的值并不会跟着改变;如果想要页面上的值也跟着改变的话,需要通过 this.setData 来操作。而 Vue 默认就是双向绑定,只改变了某个变量的值, 页面上也会跟着改变。

7、请谈谈小程序的生命周期函数?

  全局生命周期 app.js:
    onLaunch() 小程序初始化,只会调用一次,可获取当前页面路径中的参数;
    onShow() 页面显示或切入前台时触发,一般用来发送数据请求;
    onHide() 页面隐藏或切入后台时触发;
    onError() 页面发生错误时触发;
    onPageNotFound() 小程序要打开的页面不存在时触发,可以在此函数进行重定向操作。
  小程序页面的生命周期:
    onLoad() 页面加载时触发,只会调用一次,可获取当前页面路径中的参数;
    onShow() 页面显示或切入前台时触发,一般用来发送数据请求;
    onReady() 页面初次渲染完成时触发, 只会调用一次,代表页面已可和视图层进行交互;
    onHide() 页面隐藏或切入后台时触发, 如底部 tab 切换到其他页面或小程序切入后台等;
    onUnload() 页面卸载时触发,如 redirectTo 或 navigateBack 到其他页面时;
    onPullDownRefresh() 下拉刷新的钩子函数,用户下拉刷新时会自动走到这个函数中;
    onReachBottom() 上拉触底的钩子函数;
    onShareAppMessage() 用户点击右上角分享。
  小程序组件中的生命周期:
    lifetimes:组件生命周期
      created() 在组件实例刚刚被创建时执行;
      attached() 在组件实例进入页面节点树时执行;
      ready() 在组件在视图层布局完成后执行;
      moved() 在组件实例被移动到节点树另一个位置时执行;
      detached() 在组件实例被从页面节点树移除时执行;
      error() 每当组件方法抛出错误时执行。
    pageLifetimes:组件所在页面的生命周期
      show() 页面被展示时执行;
      hide() 页面被隐藏时执行;
      resize() 页面尺寸变化时执行。

8、简述微信小程序原理?

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

9、请谈谈原生开发小程序、wepy、mpvue、taro 的对比?

小程序原生和wepy、mpvue、uni-app、taro等主流开发框架,哪个好?这里是深度横评对比
小程序第三方框架对比 ( wepy / mpvue / taro )

10、哪些方法来提高微信小程序的应用速度?

  提高页面的加载速度
  用户行为预测 # 什么叫行为预测
  减少默认 data 的大小
  组件化方案 # 使用

11、怎么解决微信小程序的异步请求问题?

  小程序支持 ES6 语法,使用 Promise 来解决异步请求

function asyncFn1() {
  return new Promise((resolve, reject) => {
    // .........
  });
}
// 调用
asyncFn1()
.then(asyncFn2)
.then(asyncFn3);
12、小程序关联微信公众号如何确定用户的唯一性?

  使用 wx.getUserProfile,可获取 encryptedData,里面有 union_id,后端需要进行对称解密。 ( 无法通过wx.getUserInfo与

你可能感兴趣的:(微信小程序)