构建基于工作时间与工作日的智能计数器
在许多应用场景中，我们需要一个计数器不仅能持续递增，还能根据特定的时间规则（如工作日、工作时间）进行智能的暂停与恢复，并在每月初自动重置。本文将详细讲解如何使用JavaScript实现这样一个功能完善的计数器，包括其核心逻辑、代码实现以及需要注意的细节。
核心功能需求分析
一个理想的智能计数器应满足以下条件：
- 按分钟递增： 每分钟计数器值增加1。
- 工作时间限制： 仅在指定的工作时间内（例如上午6点至晚上8点）进行递增。
- 工作日限制： 仅在指定的工作日内（例如周一至周五）进行递增。
- 暂停与显示： 在非工作时间或周末，计数器暂停递增，但仍显示当前的累计值。
- 值继承： 暂停后，下次进入工作时间时，从上次的累计值继续递增。
- 每月重置： 每月1号，计数器自动重置，从0开始重新计数。
实现思路与关键逻辑
为了实现上述功能，我们需要精确地获取当前时间信息，并根据预设规则进行判断和计算。
1. 获取当前时间信息
首先，获取当前的日期和时间是所有判断的基础。Date 对象提供了丰富的方法来获取年、月、日、小时、分钟和星期几。
var currentDate = new Date(); var currentDay = currentDate.getDay(); // 0: 星期日, 1: 星期一, ..., 6: 星期六 var currentHour = currentDate.getHours(); var currentMinutes = currentDate.getMinutes(); var currentDayOfMonth = currentDate.getDate(); // 当前月份的日期 (1-31)
2. 定义工作时间与日期规则
将工作时间范围和周末定义为变量，增强代码的灵活性和可配置性。
var weekEndDays = [0, 6]; // 星期日和星期六 var startHour = 6; // 工作开始时间 (6 AM) var endHour = 20; // 工作结束时间 (8 PM)
3. 判断当前是否在工作时段
根据定义的规则，判断当前时间是否为周末或是否在工作时间之外。
var isWeekend = weekEndDays.indexOf(currentDay) > -1; var isOutsideWorkingHours = currentHour < startHour || currentHour >= endHour;
4. 计算历史工作日累积值
计数器需要从月初开始累积。这意味着我们需要计算从本月1号到当前日期前一天，总共有多少个工作日，并将这些工作日的分钟数累加起来。
var daysSinceStart = 0;
// 遍历从本月1号到当前日期前一天
for (let i = 1; i < currentDayOfMonth; i++) {
let checkDate = new Date(currentDate.getFullYear(), currentDate.getMonth(), i);
// 如果不是周末，则计入工作日
if (weekEndDays.indexOf(checkDate.getDay()) === -1) {
daysSinceStart++;
}
}
// 特殊情况：如果今天是工作日，且当前时间已过工作结束时间，则将今天计为完整的一个工作日
// 这样可以确保在一天工作结束后，计数器值反映了当天完整的贡献
if (!isWeekend && isOutsideWorkingHours && currentHour >= endHour) {
daysSinceStart++;
}这里的 daysSinceStart 变量将存储从本月1号到当前时刻（如果已过工作时间则包含今天）为止，完整工作日的数量。
5. 计算当前工作日已过分钟数
如果当前是工作日且在工作时间内，我们需要计算从工作开始时间到当前时间已经过去了多少分钟。
var minutesSinceStartOfDay = 0;
if (!isWeekend && !isOutsideWorkingHours) {
// (当前小时 - 工作开始小时) * 60 + 当前分钟
minutesSinceStartOfDay = (currentHour - startHour) * 60 + currentMinutes;
}6. 初始化计数器
计数器的初始值是历史工作日累积的分钟数，加上当前工作日已经过去的分钟数。每个工作日的总分钟数是 (endHour - startHour) * 60。
var counter = daysSinceStart * (endHour - startHour) * 60 + minutesSinceStartOfDay;
7. 实时递增与暂停机制
使用 setInterval 每分钟更新计数器。关键在于，在 setInterval 的回调函数内部，必须再次检查当前是否在工作时段。这样才能实现动态的暂停和恢复。
var intervalId = setInterval(function() {
// 每次递增前重新获取时间并判断，以应对跨小时或跨天的情况
var now = new Date();
var currentDayNow = now.getDay();
var currentHourNow = now.getHours();
var isWeekendNow = weekEndDays.indexOf(currentDayNow) > -1;
var isOutsideWorkingHoursNow = currentHourNow < startHour || currentHourNow >= endHour;
if (isWeekendNow || isOutsideWorkingHoursNow) {
// 即使暂停，也需要持续输出当前计数，满足“显示值”的需求
console.log('Counter paused. Current value:', counter);
return; // 暂停递增
}
counter++;
console.log('Counter:', counter);
}, 60000); // 60000 毫秒 = 1 分钟在页面刷新时，为了立即显示当前计数器的值，可以在 setInterval 启动前输出一次。
console.log('Initial Counter Value:', counter);8. 月末自动重置
由于 daysSinceStart 的计算总是从当前月份的1号开始，所以当月份变化时，计数器会自然地从新月份的1号重新开始计算，从而实现了每月自动重置的功能。
完整代码示例
将上述逻辑整合，形成一个完整的JavaScript函数。
function startWorkingHoursCounter() {
// 获取当前日期和时间
var currentDate = new Date();
var currentDay = currentDate.getDay(); // 0: 星期日, 1: 星期一, ..., 6: 星期六
var currentHour = currentDate.getHours();
var currentMinutes = currentDate.getMinutes();
var currentDayOfMonth = currentDate.getDate(); // 当前月份的日期 (1-31)
// 定义工作日和工作时间参数
var weekEndDays = [0, 6]; // 周末：星期日和星期六
var startHour = 6; // 工作开始时间 (上午6点)
var endHour = 20; // 工作结束时间 (晚上8点)
var workingMinutesPerDay = (endHour - startHour) * 60; // 每天工作分钟数
// 判断当前是否为周末或非工作时间
var isWeekend = weekEndDays.indexOf(currentDay) > -1;
var isOutsideWorkingHours = currentHour < startHour || currentHour >= endHour;
// 计算从本月1号到当前日期前一天的总工作分钟数
var daysSinceStart = 0;
for (let i = 1; i < currentDayOfMonth; i++) {
let checkDate = new Date(currentDate.getFullYear(), currentDate.getMonth(), i);
if (weekEndDays.indexOf(checkDate.getDay()) === -1) { // 如果不是周末
daysSinceStart++;
}
}
// 特殊处理：如果今天是工作日且已过工作结束时间，则将今天计为完整工作日
if (!isWeekend && isOutsideWorkingHours && currentHour >= endHour) {
daysSinceStart++;
}
// 计算当前工作日已过的分钟数
var minutesSinceStartOfDay = 0;
if (!isWeekend && !isOutsideWorkingHours) {
minutesSinceStartOfDay = (currentHour - startHour) * 60 + currentMinutes;
}
// 初始化计数器：历史工作日总分钟数 + 当前工作日已过分钟数
var counter = daysSinceStart * workingMinutesPerDay + minutesSinceStartOfDay;
// 页面加载或刷新时显示初始计数器值
console.log('Initial Counter Value:', counter);
// 每分钟递增计数器
var intervalId = setInterval(function() {
// 每次递增前重新获取当前时间，确保动态判断的准确性
var now = new Date();
var currentDayInInterval = now.getDay();
var currentHourInInterval = now.getHours();
var isWeekendInInterval = weekEndDays.indexOf(currentDayInInterval) > -1;
var isOutsideWorkingHoursInInterval = currentHourInInterval < startHour || currentHourInInterval >= endHour;
if (isWeekendInInterval || isOutsideWorkingHoursInInterval) {
// 在非工作时间或周末，暂停递增，但仍显示当前值
console.log('Counter paused. Current value:', counter);
return; // 停止本次递增
}
// 在工作时间，递增计数器
counter++;
console.log('Counter:', counter);
}, 60000); // 60000 毫秒 = 1 分钟
}
// 启动计数器
startWorkingHoursCounter();注意事项与优化建议
- setInterval 的精度问题： setInterval 并非绝对精确，它只能保证在指定时间间隔后将回调函数放入事件队列。如果事件队列繁忙，实际执行时间可能会有延迟，导致长期运行下计数器与真实时间存在微小偏差。对于大多数非严格精度要求的场景，这种方式是可接受的。如果需要极高精度，可能需要考虑更复杂的同步机制或服务器端计时。
- 计数器持久化： 当前方案在页面刷新后，计数器会根据当前时间重新计算。如果需要计数器值在页面刷新后依然保持，可以考虑使用 localStorage 或 sessionStorage 来存储 counter 的值，并在初始化时读取。
- 配置灵活性： 将 startHour、endHour 和 weekEndDays 定义为变量，使得修改工作规则变得非常简单。可以进一步将其封装为配置对象，甚至从外部文件或用户界面加载。
- 用户界面集成： 示例代码仅通过 console.log 输出计数器值。在实际应用中，您需要将 counter 的值更新到网页的某个HTML元素上，例如：document.getElementById('myCounterDisplay').innerText = counter;。
总结
通过上述详细的逻辑分析和代码实现，我们成功构建了一个能够根据工作时间、工作日进行智能递增，并在每月初自动重置的JavaScript计数器。这个解决方案考虑了多种时间状态和边界条件，提供了高度的灵活性和可读性，适用于需要精确时间管理和统计的各类Web应用。
