用setTimeout代替setInterval

前言

今天分享的小技巧是我在工作开发过程中遇到的一个问题，觉得处理这个问题比较不错，给大家分享一下

一、场景

当时的场景大致是这个样子的，拿到一个带开始时间和结束时间的一个对象数组，当当前时间在对象某一个时间段的时候，需要查询这个时间段的数据，当然查询数据在这不做考虑

javascript 复制代码

const arr = [
  { startTime: '2026-01-08 20:15', endTime: '2026-01-08 20:31', id: 1 },
  {
    startTime: '2026-01-08 20:32',
    endTime: '2026-01-08 20:45',
    id: 2,
  },
]

当当前时间在20:15-20:31的时候，需要干其他事，当在20:32-20:45需要做一些事

这就是这个问题的场景

二、方案

我相信大家有一个方案肯定轮询，去不断反复判断当前时间在哪个阶段；

但是这种会有以下几个问题

如果轮询设置时间过长，会导致无法及时获取数据；比如我设置10分钟一次，但是恰好我一分钟的时候就进入20:32，那么我需要额外等待9分钟才能查到数据
如果设置过短，计算太过频繁，会影响性能（当然性能影响很小）

这就引出我们今天这个解决方案，用setTimeout来处理

解决方案

大致思路事，初始化调用的时候计算当前时间与下一条的开始时间的差值，然后在setTimeout里面继续执行这个方法，延迟时长设置为你计算的差值，代码如下

javascript 复制代码

import dayjs from 'dayjs'
const arr = [
  { startTime: '2026-01-08 20:15', endTime: '2026-01-08 20:46', id: 1 },
  {
    startTime: '2026-01-08 20:47',
    endTime: '2026-01-08 20:45',
    id: 2,
  },
]
// 获取当前时间戳
export const getCurrentTime = () => {
  return dayjs().unix()
}
// 比较当前时间
export const culcTime = (time: string) => {
  const currentTime = getCurrentTime()
  //   获取20:15的时间戳
  const timeStamp = dayjs(time).unix()
  return timeStamp - currentTime
}
// 干其他事
const doOtherThing = () => {
  console.log('干一些其他事')
}
export const checkTime = () => {
  const time = culcTime(arr[1].startTime)
  doOtherThing()
  
  if (time <= 0) {
    return
  }
  setTimeout(() => {
    checkTime()
  }, time * 1000)
}

我们看一下案例，数据的开始结束时间，自己定义以下

第一次

第二次

这样就能很好的避免上面所说的一些问题

虽然setTimeout也并不非常准确（dddd（懂得都懂）），但是这些误差是在能接受的范围的

也并不需要考虑

总结

以上就是一种在这种场景的比较好的优化手段，ai给的提示（ai真猛）

如果有更好的方案，欢迎提出