微信小程序的常见的面试题(总结)

2023-11-06

1、微信小程序有几个文件

  • WXML(WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件、事件系统,可以构建出页面的结构。内部主要是微信自己定义的一套组件
  • WXSS (WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式
  • js逻辑处理,网络请求
  • json小程序设置,如页面注册,页面标题及tabBar

2、微信小程序怎样跟事件传值

给 HTML 元素添加 data-*属性来传递我们需要的值,然后通过 e.currentTarget.dataset 或 onload的 param参数获取。但 data -名称不能有大写字母和不可以存放对象

3、小程序的 wxss 和 css 有哪些不一样的地方?

  • wxss的图片引入需使用外链地址
  • 没有 Body;样式可直接使用 import 导入

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

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

5、微信小程序与vue区别

  • 生命周期不一样,微信小程序生命周期比较简单
  • 数据绑定也不同,微信小程序数据绑定需要使用{{}},vue 直接:就可以 显示与隐藏元素,vue中,使用 v-if和 v-show控制元素的显示和隐藏,小程序中,使用wx-if和hidden 控制元素的显示和隐藏
  • 事件处理不同,小程序中,全用 bindtap(bind+event),或者 catchtap(catch+event)绑定事件,vue:使用v-on:event 绑定事件,或者使用@event绑定事件
  • 数据双向绑定也不也不一样在 vue中,只需要再表单元素上加上 v-model,然后再绑定 data中对应的一个值,当表单元素内容发生变化时,data中对应的值也会相应改变,这是 vue非常 nice 的一点。微信小程序必须获取到表单元素,改变的值,然后再把值赋给一个 data中声明的变量。

6、小程序的双向绑定和vue哪里不一样

小程序直接 this.data属性是不可以同步到视图的,必须调用:

this.setData({
    // 这里设置
})

7、简述微信小程序原理

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

8、小程序的生命周期函数

  • onLoad 页面加载时触发。一个页面只会调用一次,可以在onLoad 的参数中获取打开当前页面路径中的参数
  • onShow() 页面显示/切入前台时触发
  • onReady() 页面初次渲染完成时触发。一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互
  • onHide() 页面隐藏/切入后台时触发。 如 navigateTo 或底部 tab 切换到其他页面,小程序切入后台等
  • onUnload() 页面卸载时触发。如 redirectTo 或 navigateBack 到其他页面时

9、哪些方法可以用来提高微信小程序的应用速度

1、提高页面加载速度

2、用户行为预测

3、减少默认 data 的大小

4、组件化方案

10、微信小程序的优劣势

优势

即用即走,不用安装,省流量,省安装时间,不占用桌面 依托微信流量,天生推广传播优势 开发成本比 App 低

缺点

用户留存,即用即走是优势,也存在一些问题 入口相对传统 App 要深很多 限制较多,页面大小不能超过2M。不能打开超过10个层级的页面

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

  • 小程序支持大部分 ES6 语法
  • 在返回成功的回调里面处理逻辑Promise异步

12、如何实现下拉刷新

首先在全局 config 中的 window配置 enablePullDownRefresh ,在 Page 中定义onPullDownRefresh 钩子函数,到达下拉刷新条件后,该钩子函数执行,发起请求方法 请求返回后,调用wx.stopPullDownRefresh停止下拉刷新

13、bindtap和catchtap的区别是什么

相同点:首先他们都是作为点击事件函数,就是点击时触发。在这个作用上他们是一样的,可以不做区分

不同点:他们的不同点主要是bindtap是不会阻止冒泡事件的,catchtap是阻值冒泡的

14、小程序页面间有哪些传递数据的方法

1、使用全局变量实现数据传递。在 app.js 文件中定义全局变量 globalData, 将需要存储的信息存放在里面

2、使用 wx.navigateTo与 wx.redirectTo 的时候,可以将部分数据放在 url 里面,并在新页面onLoad的时候初始化

3、使用本地缓存Storage 相关

15、小程序wxml与标准的html的异同?

相同:

  • 都是用来描述页面的结构;
  • 都由标签、属性等构成;

不同:

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

16、小程序简单介绍下三种事件对象的属性列表?

基础事件(BaseEvent)

  • type:事件类型
  • timeStamp:事件生成时的时间戳
  • target:触发事件的组件的属性值集合
  • currentTarget:当前组件的一些属性集合

自定义事件(CustomEvent)

  • detail

触摸事件(TouchEvent)

  • touches
  • changedTouches

17、小程序对wx:if 和 hidden使用的理解?

  • wx:if有更高的切换消耗。
  • hidden 有更高的初始渲染消耗。
  • 因此,如果需要频繁切换的情景下,用 hidden 更好,如果在运行时条件不大可能改变则wx:if 较好。

18、微信小程序与H5的区别?

  • 运行环境的不同
    传统的HTML5的运行环境是浏览器,包括webview,而微信小程序的运行环境并非完整的浏览器,是微信开发团队基于浏览器内核完全重构的一个内置解析器,针对小程序专门做了优化,配合自己定义的开发语言标准,提升了小程序的性能。

  • 开发成本的不同
    只在微信中运行,所以不用再去顾虑浏览器兼容性,不用担心生产环境中出现不可预料的奇妙BUG

  • 获取系统级权限的不同

19、app.json 是对当前小程序的全局配置,讲述三个配置各个项的含义?

  • ```pages字段`` —— 用于描述当前小程序所有页面路径,这是为了让微信客户端知道当前你的小程序页面定义在哪个目录。
  • window字段 —— 小程序所有页面的顶部背景颜色,文字颜色定义在这里的
  • tab字段—小程序全局顶部或底部tab

20、小程序onPageScroll方法的使用注意什么?

由于此方法调用频繁,不需要时,可以去掉,不要保留空方法,并且使用onPageScroll时,尽量避免使用setData(),尽量减少setData()的使用频次。

21、小程序视图渲染结束回调?

使用setData(data, callback),在callback回调方法中添加后续操作代码

22、小程序同步API和异步API使用时注意事项?

wx.setStorageSync是以Sync结尾的API为同步API,使用时使用try-catch来查看异常,如果判定API为异步,可以在其回调方法success、fail、complete中进行下一步操作。

23、简述下 wx.navigateTo(), wx.redirectTo(), wx.switchTab(), wx.navigateBack(), wx.reLaunch()的区别

  • wx.navigateTo():保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面
  • wx.redirectTo():关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面
  • wx.switchTab():跳转到 abBar 页面,并关闭其他所有非 tabBar 页面
  • wx.navigateBack():关闭当前页面,返回上一页面或多级页面。可通过getCurrentPages() 获取当前的页面栈,决定需要返回几层
  • wx.reLaunch():关闭所有页面,打开到应用内的某个页面

24、如何封装微信小程序的数据请求的?

1、将所有的接口放在统一的js文件中并导出。

2、在app.js中创建封装请求数据的方法。

3、在子页面中调用封装的方法请求数据。

25、小程序与原生App哪个好?

小程序除了拥有公众号的低开发成本、低获客成本低以及无需下载等优势,在服务请求延时与用户使用体验是都得到了较大幅度 的提升,使得其能够承载跟复杂的服务功能以及使用户获得更好的用户体验。

26、webview中的页面怎么跳回小程序中?

首先要引入最新版的jweixin-x.x.x.js,然后

wx.miniProgram.navigateTo({
	url: '/pages/login/login'+'$params'
})

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

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

28、小程序调用后台接口遇到哪些问题?

1.数据的大小有限制,超过范围会直接导致整个小程序崩溃,除非重启小程序;

2.小程序不可以直接渲染文章内容页这类型的html文本内容,若需显示要借住插件,但插件渲染会导致页面加载变慢,所以最好在后台对文章内容的html进行过滤,后台直接处理批量替换p标签div标签为view标签,然后其它的标签让插件来做,减轻前端的时间。

29、webview的页面怎么跳转到小程序导航的页面?

答:小程序导航的页面可以通过switchTab,但默认情况是不会重新加载数据的。若需加载新数据,则在success属性中加入以下代码即可:

success: function (e) {
    var page = getCurrentPages().pop();
    if (page == undefined || page == null) return;
    page.onLoad();
}

webview的页面,则通过

wx.miniProgram.switchTab({
    url: '/pages/index/index'
})

30、微信小程序的优劣势?
优势:

  1、无需下载,通过搜索和扫一扫就可以打开。

  2、良好的用户体验:打开速度快。

  3、开发成本要比App要低。

  4、安卓上可以添加到桌面,与原生App差不多。

  5、为用户提供良好的安全保障。小程序的发布,微信拥有一套严格的审查流程,不能通过审查的小程序是无法发布到线上的。

劣势:

 1、限制较多。页面大小不能超过1M。不能打开超过5个层级的页面。

 2、样式单一。小程序的部分组件已经是成型的了,样式不可以修改。例如:幻灯片、导航。

 3、推广面窄,不能分享朋友圈,只能通过分享给朋友,附近小程序推广。其中附近小程序也受到微信的限制。
 
 5、依托于微信,无法开发后台管理功能。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

微信小程序的常见的面试题(总结) 的相关文章

随机推荐

  • AD域中组织单位和组的区别

    组和组织单元有很大的不同 组主要用于权限设置 而组织单元则主要用于网络构建 另外 组织单元只表示单个域中的对象集合 可包括组对象 而组可以包含用户 计算机 本地服务器上的共享资源 单个域 域目录树或目录林 组织单位是ou 组是group 前
  • GANs:生成对抗网络系列及应用

    GANs Goodfellow和Bengio等人发表在NIPS 2014年的文章Generative Adversarial Network是生成对抗网络的开创文章 论文思想启发自博弈论中的二人零和博弈 在二人零和博弈中 两位博弈放的利益之
  • 显示生成连续大小写字母

    9 生成连续大小写字母 package array 显示生成连续字母 public class array4 public static void main String args TODO Auto generated method st
  • java实现分页功能_Java实现简单的分页功能

    本文实例为大家分享了Java实现分页功能的具体代码 供大家参考 具体内容如下 不用根据改变SQL的形式去查询 直接查询所有的数据 根据页码自动显示数据 分页对象 public class PageUtils implements Seria
  • windows知识系列:硬软连接

    总结 创建硬连接 mklink H link 要关联的文件夹 创建软连接 mklink D link 要关联的文件夹 参考 硬 软连接 以及在windows中的用法
  • OPENCV4学习代码-Mat类构造与赋值

    代码清单2 4 默认构造函数使用方式 cv Mat Mat 代码清单2 5 利用矩阵尺寸和类型参数构造Mat类 cv Mat Mat int rows int cols int type 代码清单2 6 用Size 结构构造Mat类 cv
  • 华为机考笔记之字符串以水仙花规则拆分

    题目 一 输入一组字符串 求字符串分组后 每组的和为水仙花数 注 水仙花数是一个三位数 其个位 十位 百位的立次方 的和等于自身 如 371 3 3 7 3 1 1 1 如果无法找到该分组 返回0 2 找到该分组 切分组不唯一 返回 1 3
  • js 每隔 10 秒钟 运行一次,发送一个 ajax 请求

    每隔 10 秒钟 运行一次 发送一个 ajax 请求 function runEvery10Sec 1000 10 10 秒钟 setTimeout runEvery10Sec 1000 10 ajax dataType json type
  • jQuery取得select选中的值

    jQuery取得select选中的值 本来以为jQuery select1 val 是取得选中的值 那么jQuery select1 text 就是取得的文本 这是不正确的 正确做法是 jQuery select1 option selec
  • Qt中的单例模式:实现一个单例的界面类

    文章目录 前言 一 什么是单例模式 二 单例模式的优缺点及使用场景 三 Qt中单例类的创建 四 单例类的使用 测试 总结 前言 本文主要讲述了使用加锁的懒汉式来实现单例 文中示例将一个界面类修改为单例类 并在主界面获取多次该类的实例来进行测
  • 统计一个字符串中大写字母字符,小写字母字符,数字字符出现的次数

    统计一个字符串中大写字母字符 小写字母字符 数字字符出现的次数 不考虑其他字符 1 需求 统计一个字符串中大写字母字符 小写字母字符 数字字符出现的次数 不考虑其他字符 举例 Hello123World 结果 大写字符 2个 小写字符 8个
  • IDEA中常用的插件

    目录 Free MyBatis plugin codehelper generator grep console Translation Alibaba Java Coding Guidelines CamelCase GenerateAl
  • unordered_map的哈希HASH重载——举例unordered_map与pair联合使用

    有些时候 为了图省力 我们没准会这样的调用一个函数 unordered map lt pair
  • 分子模拟—Ovito渲染案例教程

    heartsuit spadesuit 分子模拟 Ovito渲染案例教程 heartsuit
  • 利用Nodejs 构建 WEB服务器

    前言 Web 服务器一般指网站服务器 是指驻留于因特网上某种类型计算机的程序 可以 向浏览器等 Web 客户端提供文档 也可以放置网站文件 让全世界浏览 可以放置数据文件 让全世界下载 目前最主流的三个 Web 服务器是 Apache Ng
  • 运算放大器芯片输出扩流电路三例

    工作原理 图1所示为三种集成运算放大器输出电流扩展电路 图 a 为双极性扩展电路 图 b 图 c 为单极性扩展电路 在图1 a 所示电路中 当输出电压为正时 BG1管工作 BG2管截止 输出电压为负时 BG1管截止 BC2管工作 二极管D1
  • C、C++、C#、python、java编程—文件读取

    C资料 菜鸟教程 C语言中文网 C community C 资料 菜鸟教程 cplusplus C community C 资料 菜鸟教程 microsoftC 文档 python资料 菜鸟教程 python标准库 Java资料 菜鸟教程
  • Multisim14.0安装教程

    2 安装步骤 解压 打开 Multisim14 0 鼠标右击 NI Circuit Design Suite 14 0 exe 选择 以管理员身份运行 点击确定 选择文件的解压路径 最好不解压在C盘 安装完成删掉即可 然后点击 Unzip
  • 华为OD机试2023(JS,C++,JAVA,PYTHON)-服务器能耗统计

    本篇题解 服务器耗能 题目描述 服务器有三种运行状态 空载 单任务 多任务 每个 时间片 的能耗的分别为 1 1 1 3 3 3 4 4 4 每个任务由起始时间片和结束时间片定义运行时间 如果一个时间片只有一个任务需要执行 则服务器处于单任
  • 微信小程序的常见的面试题(总结)

    1 微信小程序有几个文件 WXML WeiXin Markup Language 是框架设计的一套标签语言 结合基础组件 事件系统 可以构建出页面的结构 内部主要是微信自己定义的一套组件 WXSS WeiXin Style Sheets 是