code review

一直觉得我主管浩哥是个很强的技术大佬，正好他让我接手了一个小程序项目，那么就来学习一下他写的代码吧！

小程序

data 应只包括渲染相关的数据，所以这里如果只是为了保存定时器 ID，没必要使用 setData

建议将定时器 ID 保存在 this 上即可。

Page({
  timerId: null,

  onLoad: function () {
    // 初始化定时器
    this.timerId = setInterval(() => {
      console.log('定时器在运行');
    }, 1000);
  },

  onUnload: function () {
    const { timerId } = this;
    if (timerId) {
      // 清除定时器
      clearInterval(timerId);

      // 将定时器ID设置为null
      this.timerId = null;
    }
  },
});

wx.request 封装

为什么执行reject()之后，还要执行 resolve()？

看到这里时，我有点疑惑，为什么执行reject()之后，还要执行 resolve()？
执行reject()之后，Promise 状态已经被固定了，再执行resolve()也没有意义。打了个断点（**f11 **step into next function call ）看下，发现resolve(res)并没有执行。

为了不造成混淆，建议在res.data.code !== 0代码块末尾加个return，或者在reject()前面加个return

错误处理：通过自定义的错误类 ErrorRequest、ErrorBiz 和 ErrorAuth 对不同类型的错误进行了分类

看下控制台：

并没有提示错误信息输出。父类构造函数Error起到了什么作用？

点击 Error，如图所示：

可以看到构造函数ErrorConstructor接收一个 message 参数，那我们把接口的错误消息传递进去看下，修改下代码

效果如下：

修改过后在控制台展示了更详细的错误信息。

将后端的数据复制给 this.data this.data = data这点挺好的，这样，在捕获到错误之后，可以通过error.data来获取后端给的信息。

但是我没看到他是怎么使用的，所以我在错误类上加了个获取 this.data 的方法，方便在业务层面获取到：如下

class ErrorBiz extends ErrorRequest {
  // 添加一个方法，用于获取业务错误信息
  getBizErrorData() {
    return this.data;
  }
}

业务中使用：

try {
  const age = await api.getPhotoCheckAge(phoneUrl);
} catch (err) {
  const bizErrorData = err.getBizErrorData();
}

css

指向特定元素，通过附加类的预选元素的选择器，中间没有空格。如.title.active

适配刘海屏设备安全区域，保证内容不被遮挡。

1. padding-bottom: env(safe-area-inset-bottom);：
   • env() 函数是 CSS 中的一个环境变量函数，用于获取设备环境变量的值。
   • safe-area-inset-bottom 表示底部安全区域的大小。
   • 这行样式代码的作用是设置底部内边距为底部安全区域的大小。
2. padding-bottom: constant(safe-area-inset-bottom);：
   • constant() 函数是 CSS 中的一个函数，用于获取一个常量的值。
   • safe-area-inset-bottom 同样表示底部安全区域的大小。
   • 这行样式代码的作用也是设置底部内边距为底部安全区域的大小，但使用了 constant 函数。

任务进度条
后端提供任务总时长，过了多少时间除以总时间就可以算出当前进度，Math.round((Date.now() - startTime) / totalTime * 100)

Js

列表滚动加载，判断是否已全部加载结束
const isLoadEnd = respList.length < this.data.pageSize，也就说，如果本次请求响应的条数小于本次请求的条数，就可以表示已全部加载结束

不需要后端给你总页数pages/total，再根据const isLoadEnd = current < pages 或者 const isLoadEnd = showList.length < total判断是否已全部加载结束