小程序的目录结构优化？

在去年的时候，我在公司负责过一个完整的小程序。也有和其他同事合作过小程序。

• 我自己在开发一个小程序的时候，为了后面方便项目的扩展，把小程序默认的项目结构优化了一遍。主要是以下几个方面
  • 将npm构建的目录修改以下，改为类似于之前开发vue项目的目录结构。主要涉及到project.config.json这个文件里面的几个setting的配置，关于业务代码所在的目录，和packagejson所在的目录。具体的属性名称官网上直接一找就可以了，名称具体属性记不太清
  • 配置整个小程序项目的sass支持，原生的wxss不好用
  • 开发者工具我用过很多， 常见的小程序开发者工具，在开发原生小程序非常方便。 还有vscode去开发uniapp小程序这个比较搭配， 最后还有一个uni-app的专属工具 hbuilderx也可以使用

小程序项目里面怎么发请求？

首先原生小程序只支持wx.request这个内置的api去发请求，但是这个方法不支持promise，不支持请求拦截器等比较好用的配置，所以我在工作里面会结合一些第三方包去二次封装项目的请求方法

我记得去年我的一个项目用的是wechat-http的一个包，里面的方法和axios类似，使用其他很流畅。自己在项目中二次封装了这个第三方包，并挂载到全局wx上面，方法各个页面的使用

vue里面eventbus--事件总线

const bus = new Vue()
bus.$emit('事件名称', 传值)
bus.$on('事件',() => {})
bus.$off()
bus.$once

不要动不动就是用vuex

小程序里面怎么样给所有需要权限的页面做一个组件？

• 创建一个authorization组件，将我们需要权限的页面的代码，放到这个组件的插槽里面去
• 在组件的wxml里面，给slot标签写上wx:if 通过 isLogin用户是否登录来判断是否显示当前页面的内容

**问题：**之前写过小程序吗？哪些地方你印象比较深刻？或者哪些地方你觉得设计比较巧妙

面试话术： 我在之前自己独立负责过一个项目，在里面做过一个功能就是检测所有的页面是否登录过，登录过才能访问，没有登录过就不能访问。我之前在vue的项目里面是通过permission文件里面的路由守卫beforEach去写的。小程序里面没有这个功能。所以我自己封装了一个组件。将需要校验的页面的内容 通过插槽的形式放在我们自定义的组件内部，在自定义的组件里面 通过给slot这个标签 添加wx:if控制条件，如果登录就显示插槽内容，没有登录过就显示跳转到登录页面。从而达到复用的目的

自己写代码的一些思路或方向

• 在写一些比较复杂的函数的时候，先会将所有错误的情况先处理一下，然后在通过return控制代码的流程。等所有的错误情况都处理完了最后在 写正常的逻辑操作。 之前我在写小程序的登录，以及自定义检验的函数里面有很多类似的场景。这样代码会很清晰，少了很多else操作

submitForm() {
  // 函数里面先写所有失败的情况，最后在处理正常的逻辑
  console.log(1);
  const valideMobileRes = this.validateMobile(this.data.mobile)
  const validateCodeRes = this.validateCode()

  if (!valideMobileRes || !validateCodeRes) return

  // 下面代码才是所有检验通过以后，执行的地方，比如等下发请求等等
  console.log(2);
},

你以前在小程序里面和后端沟通多吗？遇到过哪些沟通耗时很久的问题

• 我之前做一个个人信息页面，需要将用户的微信头像上传到我们的系统里面来。微信小程序里面的上传是wx.uplaodFile这个方法，里面的url是需要传递我们自己的服务器地址。 然后后端不是很懂微信uploadFile方法里面需要的一些参数，还是按照之前的普通请求给的，例如 type name file等属性。 后端给的字段和微信官网的字段对不上。这里和我们公司的后端扯皮了很久。最后以微信官网的字段为准，最后才实现了上传需求

腾讯位置服务

• 经纬度转换为地名
• this的指向你说一说？ 把前面背的八股文巴拉输出一遍， 再说 我之前项目里面，写过很多小程序的腾讯储存桶，腾讯位置定位服务，里面很多api的异步接口都是 success这种回调函数的写法，我们在掉this.setData的时候，会出现值绑定不上去的问题，这种情况一般是this指向混乱。我一般有两种修改问题的方式： 1. 在外部定义一个that变量，保存this 2.将success回调函数改写为es6的 箭头函数。

this指向带上场景回答

this的指向你说一说？ 把前面背的八股文巴拉输出一遍， 再说 我之前项目里面，写过很多小程序的腾讯储存桶，腾讯位置定位服务，里面很多api的异步接口都是 success这种回调函数的写法，我们在掉this.setData的时候，会出现值绑定不上去的问题，这种情况一般是this指向混乱。我一般有两种修改问题的方式： 1. 在外部定义一个that变量，保存this 2.将success回调函数改写为es6的 箭头函数。

工作里面封装过函数吗？自己有哪些封装函数的技巧？

这个我在工作里面经常封装。 说白了函数封装就是将重复的代码块放在一起，然后不同的地方去调用即可，如果不同地方调用的场景不一样，就通过传递不同的形参去写。然后根据需要在reutrn不同的返回值即可

我在上一个公司里面写过一些原生小程序， 里面的业务涉及到腾讯的地理位置服务。关于根据经纬度转换汉语地名，根据关键词搜索search周边的地名，等很多api的调用，涉及到复用，我就将他们封装为了函数，然后写了两个形参，经度和维度

常见的获取字符串某个字符索引号？获取字符串某个字符的方法

• 获取索引号 indexOf str.split('').findIndex(item => item === '号')
• str.charAt(7) str.slice(7,8) str.substr(7,1) str.substring(7, 8)

回答 核心的几个关键词 indexOf findIndex 可以获取索引号，字符串的话需要先转换为数组

字符串获取，一般我们采用 charAt slice substr substring 等方法， 方法里面具体的 以索引号开头，索引号结尾还是 截取的字符串长度等等具体的 含义，我们一般通过开发者工具的代码提示使用，这种一般不会去记忆

初入公司看代码写代码期间，可以问同事什么问题？

• 我们是问一些 变量和方法的 使用，是什么意思？有什么注意点？
• 不能问的是一些基本的语法， 比如 小程序里面 循环怎么写？

记住： 能百度的就不能问， 不能百度的就可以问

dayjs 和 momentjs区别？ 项目里面怎么选择？

https://juejin.cn/post/6922398807472750605

你做过哪些兼容性问题？

一般的只会说写一些web里面的css等兼容性

说点不一样的： 我之前做过一个项目，在安卓手机里面，和ios手机里面， 同一个代码，效果不一样。 具体在xxx场景。

ios -- 刘海 --- 底部安全区域

安卓 --- 有些有有些没有

你在工作里面 使用的编程式多还是声明式导航多一些？ -- 小程序，vue都是一样说的

这个要看情况，一般如果是模板列表里面跳转页面，那么采用声明式导航，因为模板上面就可以直接使用参数，不需要传参到js里面。 还有些情况，如果是发送请求成以后，才能跳转，那么必须使用 编程式导航

简历上面写的项目

3 年经验+ 本科 ------- 至少5个项目

vue2 vue3 小程序 uniapp

后台 + h5，

小程序 + 原生（享+小程序）+ uniapp小程序(vue语法 品优购)

可以给面试官说的话

1. 你就说，我没事的时候经常看一下vant的源码，发现了一些特点，就是vant的dialog是通过 popup组件二次封装

   看一看 axios源码 --- 知道里面的 代码是通过 XMLHttpRequest 封装的

2. 之前有同事的代码，在写对象的解构赋值的时候，解构的变量如果没有值，就是undefined。如果是undefined就很容易造成错误。 所以我给团队 提了个建议， 就是所有的对象解构，都必须有一个默认值，这样就会增加代码的健壮性，减少bug

3. 我去年做过一个小程序，用到了地图组件，感觉还比较复杂。它那个业务是针对于3KM以内的小区，提供上门维修服务、提供上门保洁服务， 提供代养宠物服务。 需要我们的工作人员通过 小程序，里面的用户房屋的标记点，去对应的位置提供服务器。 我在写的时候，会将服务器返回的一些经纬度数组，加工处理以下，转换为map组件可以使用的 markers 数据。在我们的详情页面显示 各种标记点。方便工作人员查看

vant的时间控件， 最小值min-date里面 ，双大括号里面 不让写 Date.now() 这个语句， 只能写数字

小程序生成二维码 --- weapp-qrcode （qrcode.js）

• 一种是后端 生成二维码 直接返回一张图片给前端
• 后端返回地址字符串给前端， 前端通过地址 自己二维码

小程序的上拉加载，下拉刷新 ---- scroll-view的上拉加载和下拉刷新

• 实现这个功能就要看页面里面是哪个区域进行下拉，是整个页面，还是局部的下拉
• 如果是整个页面的下拉，就是在app.json里面配置enablePullDownRefresh，并在js里面监听onPullDownRefresh这个事件
• 如果是页面的某一个区域下拉，就需要使用scroll-view组件包裹，使用这个组件的上拉刷新的配置和监听函数
• 上拉加载也是一样的，有页面的上拉加载和 scroll-view区域的上拉加载。只需要配置对应的 属性 和监听事件就可以了
• 核心代码就是 在发请求拼接数据的时候，不是等号，而是拼接旧数据和新数据。采用数组展开运算符。判断是用的 当前页码值 * 每页条数 < total对比