放假自定义作息总记不住几点该干嘛:写了个作息表
想把放假的一天按"起床、工作、运动、读书、睡觉"切几段,每到一个点提醒自己该切换状态。手机自带的闹钟只能定具体时刻,没法直观看到"现在处于哪一段、下一段几点开始"。于是写了个网页作息表:左边列时间段,右边高亮"当前正在进行的那一段",到点弹提醒。
一、时间字符串怎么解析
用户输入的是 "09:00"、"14:30" 这种字符串。比较大小之前得转成分钟数,最简单:
function toMin(t) {
const [h, m] = t.split(':').map(Number);
return h * 60 + m;
}
function nowMin() {
const d = new Date();
return d.getHours() * 60 + d.getMinutes();
}
转成"今天第几分钟"之后,所有比较都变成纯数字,不用处理时分进位那套。
二、判断"现在在哪一段"
作息是若干不重叠区间 [start, end)。当前分钟落在哪个区间,哪段就是"进行中"。
let schedule = [
{ name: '工作', start: '09:00', end: '12:00' },
{ name: '午休', start: '12:00', end: '13:30' },
{ name: '运动', start: '18:30', end: '19:30' },
];
function currentBlock() {
const n = nowMin();
return schedule.find(b => n >= toMin(b.start) && n < toMin(b.end));
}
注意用的是 n < toMin(b.end),左闭右开。这样 12:00 恰好从"工作"切到"午休",不会同时命中两段。跨午夜的(比如 23:00–01:00)要单独加一天判断,本工具只管白天作息,没那个麻烦。
三、到点提醒
每分钟扫一次,发现进入了"下一段"就提醒。用 Notification 比弹窗体面:
function check() {
const block = currentBlock();
if (block && block.name !== lastBlock) {
if (Notification.permission === 'granted') {
new Notification('作息提醒', { body: '现在该:' + block.name });
}
lastBlock = block.name;
highlight(block);
}
}
setInterval(check, 60 * 1000);
lastBlock 记录上一段名字,只有"切换"时才提醒,避免每分钟弹一次。Notification 首次要用户授权,记得在按钮里调 Notification.requestPermission()。
四、配置存本地
| 字段 | 存什么 | 读时还原 |
|---|---|---|
| schedule | 整个数组 JSON | JSON.parse 回来 |
| 授权状态 | 浏览器管,不需存 | 调接口查 |
localStorage.setItem('schedule', JSON.stringify(schedule));
schedule = JSON.parse(localStorage.getItem('schedule') || '[]');
小结
作息表的核心是"区间判定":把所有时间段转成"当天第几分钟"的数字,当前分钟落在哪个 [start, end) 区间就高亮哪段,用左闭右开避免边界重叠。提醒靠每分钟比对"上一段名字"是否变化,变了才弹,跨午夜的时段要单独处理。配置整个数组 JSON 化存 localStorage,刷新不丢。
- 点赞
- 收藏
- 关注作者
评论(0)