使用Moment.js对比日内小时时段 解决日程应用时段样式设置问题

• 未将时段字符串解析为合法的Moment对象，直接传入字符串无法正确识别时间格式进行比对
• 时间早晚对应的样式返回逻辑完全写反
• 时段数组中11am后配置的是12 am（午夜0点），不符合常规日间时段顺序，应该调整为12 pm（正午12点）
• 循环逻辑冗余：模板中已经渲染了时段文本，后续append操作会导致内容重复

首先调整whenIsNow函数，先解析时段字符串为今日的整小时时间对象，再和当前整小时时间比对：

function whenIsNow(hourStr) {
  // 解析时段字符串为今日对应时间，精度截断到小时
  const blockTime = moment(hourStr, 'h a').startOf('hour');
  // 获取当前时间，同样截断到小时，避免分钟/秒数干扰时段判断
  const now = moment().startOf('hour');
  if (now.isAfter(blockTime)) {
    // 当前时间晚于时段，标记为过去
    return 'past';
  } else if (now.isBefore(blockTime)) {
    // 当前时间早于时段，标记为未来
    return 'future';
  } else {
    // 时段匹配当前小时，标记为现在
    return 'present';
  }
}

然后调整两个细节：

1. 修正mySched数组的时段顺序，将11am后的12 am改为12 pm
2. 删除循环中多余的schedTime.append(myHour)代码，避免时段文本重复渲染

内容的提问来源于stack exchange，提问作者Stephen Scott Moore