记录时间计算bug getDay()的一个坑

最近在使用时间计算展示当天所在这一周的数据 不免要获取当前时间所在周

javascript 复制代码
// 时间格式整理函数
function formatDate(date) {
  const year = date.value.getFullYear(),
    month = String(date.value.getMonth() + 1).padStart(2, '0'),
    day = String(date.value.getDate()).padStart(2, '0');

  return `${year}-${month}-${day}`;
}

const currentDate = ref(new Date()),
  currentDay = ref(currentDate.value.getDay()),
  startDate = ref(new Date(currentDate.value.getFullYear(), currentDate.value.getMonth(), currentDate.value.getDate() - currentDay.value + 1)),
  endDate = ref(new Date(currentDate.value.getF

const startTime = formatDate(startDate),
  endTime = formatDate(endDate);

let timeList = {
  startTime,
  endTime
};

console.log(timeList);

这里计算周一到周六 并展示均为正常 但计算周日时 会将时间退后一天

timeList跳转到下一周的周一到周日

问题出现在 currentDate.value.getDay() 这一行。getDay() 方法返回的是当前日期是星期几,其中星期日对应的值是 0,星期一是 1,以此类推。因此,使用 getDay() 方法获取到的是星期几的值。对 getDate() 方法和 getDay() 方法的处理进行调整

对源代码进行修改

javascript 复制代码
// 时间格式整理函数
function formatDate(date) {
  const year = date.getFullYear(),
    month = String(date.getMonth() + 1).padStart(2, '0'),
    day = String(date.getDate()).padStart(2, '0');

  return `${year}-${month}-${day}`;
}

const currentDate = ref(new Date()),
  currentDay = ref(currentDate.value.getDay()),
  startDate = ref(new Date(currentDate.value.getFullYear(), currentDate.value.getMonth(), currentDate.value.getDate() - (currentDay.value === 0 ? 6 : currentDay.value - 1))),
  endDate = ref(new Date(currentDate.value.getFullYear(), currentDate.value.getMonth(), currentDate.value.getDate()));

const startTime = formatDate(startDate.value),
  endTime = formatDate(endDate.value);

let timeList = {
  startTime,
  endTime
};

console.log(timeList);

在修正后的代码中,计算startDate时 通过 currentDay.value === 0 判断当前是否为星期天,

如果在正常周一到周六 比如当前天数为7月29 周六

currentDate为29 currentDay.value 为6 计算startDate时29-6+1 周一为24

当天为7月30 周日时 currentDay.value 为 0 这是getDay()设计的 周日时设为0 我们无法更改

仍按以前计算 30-0+1 自然会报错 这时跳转到下一周了 计算的周一为31 实际24

当 currentDay.value为0 时 即30时 让其 -6 而不是+1 这样30-0-6 计算的周一就能对应24

简单的数学题 其实代码实现的往往就是简单的数字逻辑

聊记一笔

相关推荐
摘星编程6 小时前
OpenHarmony + RN:Placeholder文本占位
javascript·react native·react.js
摘星编程9 小时前
React Native + OpenHarmony:Spinner旋转加载器
javascript·react native·react.js
普通网友10 小时前
新手必看!HCCDA-HarmonyOS & Cloud Apps 实验保姆级教程
javascript·angular.js
用户新10 小时前
V8引擎 精品漫游指南--Ignition篇(上) 指令 栈帧 槽位 调用约定 内存布局 基础内容
前端·javascript
Next_Tech_AI10 小时前
别用 JS 惯坏了鸿蒙
开发语言·前端·javascript·个人开发·ai编程·harmonyos
-凌凌漆-11 小时前
【vue】选项式api与组合式api
前端·javascript·vue.js
2601_9498095911 小时前
flutter_for_openharmony家庭相册app实战+通知设置实现
android·javascript·flutter
可触的未来,发芽的智生11 小时前
发现:认知的普适节律 发现思维的8次迭代量子
javascript·python·神经网络·程序人生·自然语言处理
phltxy13 小时前
Vue3入门指南:从环境搭建到数据响应式,开启高效前端开发之旅
前端·javascript·vue.js
摘星编程14 小时前
OpenHarmony + RN:ProgressBar进度条组件
javascript·react native·react.js