小程序面试题

最新推荐文章于 2023-02-04 10:55:52 发布

小郑！

最新推荐文章于 2023-02-04 10:55:52 发布

阅读量726

点赞数

分类专栏：小程序文章标签：小程序微信小程序

本文链接：https://blog.csdn.net/qq_45479398/article/details/127526826

版权

小程序专栏收录该内容

9 篇文章 1 订阅

订阅专栏

小程序面试题

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

微信小程序项目结构主要有四个文件类型：
1.wxml 模块文件，是框架设计的一套标签语言，结合基础组件、事件系统、可以构建出页面的结构；
2.wxss 样式文件，是一套样式语言，用于描述wxml的组件样式；
3.js 脚本逻辑文件，逻辑处理网络请求；
4.json 配置文件，小程序设置，如页面注册，页面标题及tabbar；
5.app.json 整个小程序的全局配置，包括：
1.pages ：（所有页面路径）
2.网络设置（网络超时时间）
3.界面表现（页面注册）
4.window（背景色、导航样式、默认标题）
5.底部tab等
6.app.js 监听并处理小程序的生命周期函数、声明全局变量；
7.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.怎么封装微信小程序的数据请求

方案一
1. 将所有的接口放在统一的js文件中并导出
2. 在app.js中创建封装请求数据的方法
3. 在子页面中调用封装的请求数据
方案二

在根目录下创建utils目录及api.js文件和apiConfig.js文件
在apiConfig.js封装基础的请求方法，设置请求体，带上token和异常处理等
在api.js中引入apiConfig.js封装好的请求方法，根据页面数据请求的urls,设置对应的方法并导出
在具体页面导入

例如
api.js

	export const configUrl = 'https://websit.tolandhealth.cn'

apiConfig.js

	import { baseUrl } from './api.js'
// const baseUrl="https://websit.tolandhealth.cn";
// 没有token
export function GetAuthService(url, data) {
	return new Promise(function(reslove, reject) {
		uni.request({
			header: {
				'Content-Type': 'application/x-www-form-urlencoded'
			},
			url: baseUrl + url, //这是接口路径
			method: "POST", //get   post 
			data: data, //接口传参
			success: res => {
				console.log('RES', res)
				if (res.statusCode == 200) {
					// console.log('200', res.data)
					// 600039


				} else {
					console.log('1234')
				}
				let aa = '';
				aa = res.data
				reslove(aa) //获取返回
			},
			fail: () => {},

			complete: () => {}
		})
	})

}
// 带token
export function GetServerData(url, data) {
	return new Promise(function(reslove, reject) {
		uni.request({
			header: {
				'Content-Type': 'application/x-www-form-urlencoded'
			},
			url: baseUrl + url, //这是接口路径
			method: "POST", //get   post 
			data: data, //接口传参
			success: res => {
				// console.log('RES', res)
				if (res.statusCode == 200) {
					// console.log('200', res.data)
					// 600039


				} else {
					console.log('1234')
				}
				let aa = '';
				aa = res.data
				reslove(aa) //获取返回
			},
			fail: () => {},

			complete: () => {}
		})
	})

}

页面引入

import {GetAuthService,GetServerData} from '../../../utils/apiConfig.js'

//没有token

var json = {
					userName:'userName',
					password: 'password'
				}
				
GetAuthService('/webservice/wtWebApiH/GetAuthService', json).then((res) => {
console.log(res)
})

//带token

GetServerData('/webservice/wtWebApiH/GetServerData', {
							token: token,
							infoType: '',
							jsonValue: JSON.stringify(json)
						}).then((res1) => {
						console.log(res1)
						})

5.小程序的传值方法有哪些

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

6.小程序页面跳转？

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

7.bindtap和catchtap的区别

bind事件绑定不会阻止冒泡事件向上冒泡
catch事件绑定可以阻止冒泡事件向上冒泡

8.小程序生命周期

onLoad()：页面加载时触发，只会调用一次，可获取当前页面路径中的参数
onShow()：页面显示/切入前台时触发，一般用来发送数据请求
onReady()：页面初次渲染完成时触发，只调用一次，代表页面已可和视图进行交互
onHide()：页面隐藏/切入后台时触发，如底部tab切换到其他页面或小程序切入后台等
onUnload()：页面卸载时触发，如redirectTo或navigateBack到其他页面时

9.小程序和vue双向绑定

在vue中进行数据绑定后,当数据修改了会直接更新到视图上
但是在小程序中呢,data数据修改是不会直接同步到,必须调用this.setData()这个方法
	this.setData({
	    // 这里设置
	})

10.微信小程序的优劣势

** 优势 **
即用即走，不用安装，省流量，省安装时间，不占用桌面
依托微信流量，天生推广传播优势
开发成本比 App 低
** 缺点 **
用户留存，即用即走是优势，也存在一些问题
入口相对传统 App 要深很多
限制较多,页面大小不能超过2M。不能打开超过10个层级的页面

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

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

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

如果开发者拥有多个移动应用、网站应用、和公众帐号（包括小程序），可通过 unionid 来区分用户的唯一性，因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号（包括小程序），用户的 unionid 是唯一的。换句话说，同一用户，对同一个微信开放平台下的不同应用， unionid 是相同的