js时期时间库moment.js及day.js使用

Moment.js

Moment.js 是一个轻量级且功能强大的 JavaScript 时间处理库,主要用于简化日期和时间的解析、验证、操作及格式化操作。

<script src="../plugins/moment/moment.min.js"></script>
<script src="../plugins/moment/locale/zh-cn.js"></script>
<script>
  // 设置语言环境
  moment.locale("zh-cn");

  const format_str = "YYYY-MM-DD HH:mm:ss";
  let m1 = moment(); //当前日期时间
  let m2 = moment("2022-09-15"); //指定日期时间
  let m3 = moment(1663171200000);

  console.log(m2.year(), m2.get("year")); //获取年份: 2022 2022
  console.log(m2.month(), m2.get("month")); // 0~11: 8 8
  console.log(m2.date(), m2.get("date")); //获取一个月中的某一天: 15 15
  console.log(m2.hours(), m2.get("hours")); //获取小时: 0 0
  console.log(m2.minutes(), m2.get("minutes")); //获取分钟: 0 0
  console.log(m2.seconds(), m2.get("seconds")); //获取秒数: 0 0
  console.log(m2.day(), m2.get("day"), m2.isoWeekday(), m2.get("isoWeekday")); //获取一个星期中的某一天 1-7: 4 4 4 4
  console.log(m2.weekday(), m2.get("weekday")); //获取一个星期中的某一天 0-6: 3 3
  console.log(m2.toArray()); // [2022, 8, 15, 0, 0, 0, 0]
  console.log(m2.toObject()); // {years: 2022, months: 8, date: 15, hours: 0, minutes: 0,seconds:0, milliseconds:0}

  // 时间格式化
  console.log(m2.format(format_str)); //2022-09-15 00:00:00
  console.log(m2.format("X")); //获取时间戳(以秒为单位) 返回值为字符串类型: 1663171200
  console.log(m2.unix()); //获取时间戳(以秒为单位) 返回值为数值型: 1663171200
  console.log(m2.format("x")); //获取时间戳(以毫秒为单位) 返回值为字符串类型: 1663171200000
  console.log(m2.valueOf()); //获取时间戳(以毫秒为单位) 返回值为数值型: 1663171200000

  //时区处理-转换为 UTC 时间
  console.log(m2.utc().format()); //2022-09-14T16:00:00Z
  console.log(m2.utc().format(format_str)); //2022-09-14 16:00:00
  //时区处理-转为北京时间
  console.log(m2.utcOffset(8).format(format_str)); //2022-09-15 00:00:00

  // ‌获取特定时间点
  console.log(m2.startOf("day").format(format_str)); //2022-09-15 00:00:00
  console.log(m2.endOf("day").format(format_str)); //2022-09-15 23:59:59
  console.log(m2.startOf("week").format(format_str)); //获取本周第一天(周一) 2022-09-12 00:00:00
  console.log(m2.endOf("month").format(format_str)); //获取本周周一0时0分0秒 2022-09-30 23:59:59

  // 获取月份中的天数
  console.log(m2.daysInMonth()); //30

  //设置年份
  m1.year(2019);
  m1.set("year", 2019);
  m1.set({ year: 2019 });
  //设置月份
  m1.month(11); // (0~11, 0: January, 11: December)
  m1.set("month", 11);
  //设置某个月中的某一天
  m1.date(15);
  m1.set("date", 15);
  //设置某个星期中的某一天
  m1.weekday(0); // 设置日期为本周第一天(周日)
  m1.isoWeekday(1); // 设置日期为本周周一
  m1.set("weekday", 0);
  m1.set("isoWeekday", 1);
  //设置小时
  m1.hours(12);
  m1.set("hours", 12);
  //设置分钟
  m1.minutes(30);
  m1.set("minutes", 30);
  //设置秒数
  m1.seconds(30);
  m1.set("seconds", 30);
  console.log(m1.format(format_str)); //2019-12-09 12:30:30

  //增减时间‌
  m2.add(1, "years"); //年份+1
  m2.add({ years: 1 });
  m2.add(1, "months"); //月份+1
  m2.add(1, "days"); //日期+1
  m2.add(1, "weeks"); //星期+1
  m2.add(1, "hours"); //小时+1
  m2.add(1, "minutes"); //分钟+1
  m2.add(1, "seconds"); //秒数+1
  console.log(m2.format(format_str)); //2024-11-08 01:01:00
  m2.subtract(1, "years"); //年份-1
  m2.subtract({ years: 1 });
  m2.subtract(1, "months"); //月份-1
  m2.subtract(1, "days"); //日期-1
  m2.subtract(1, "weeks"); //星期-1
  m2.subtract(1, "hours"); //小时-1
  m2.subtract(1, "minutes"); //分钟-1
  m2.subtract(1, "seconds"); //秒数-1
  console.log(m2.format(format_str)); //2022-09-29 23:59:59

  // 判断时间顺序
  console.log(m1.isBefore(m2)); //true

  //获取时间差
  console.log(m2.diff(m1)); // 返回毫秒数: 88601369226
  console.log(m2.diff(m1, "months")); // 33
  console.log(m2.diff(m1, "weeks")); // 146
  console.log(m2.diff(m1, "days")); // 1025
  console.log(m1.diff(m2, "days")); // -1025
</script>

轻量级替代库 day.js

<script src="../plugins/dayjs.min.js"></script>
<script>
  const format_str = "YYYY-MM-DD HH:mm:ss";
  let d1 = dayjs(); //当前日期时间
  let d2 = dayjs("2022-09-15"); //指定日期时间
  let d3 = dayjs(1663171200000);

  console.log(d2.year(), d2.get("year")); //获取年份: 2022 2022
  console.log(d2.month(), d2.get("month")); // 0~11: 8 8
  console.log(d2.date(), d2.get("date")); //获取一个月中的某一天: 15 15
  console.log(d2.day(), d2.get("day")); //获取一个星期中的某一天 1-7: 4 4

  // 时间格式化
  console.log(d2.format(format_str)); //2022-09-15 00:00:00
  console.log(d2.unix()); //获取时间戳(以秒为单位) 返回值为数值型: 1663171200
  console.log(d2.valueOf()); //获取时间戳(以毫秒为单位) 返回值为数值型: 1663171200000

  // ‌获取特定时间点
  console.log(d2.startOf("day").format(format_str)); //2022-09-15 00:00:00
  console.log(d2.endOf("day").format(format_str)); //2022-09-15 23:59:59
  console.log(d2.startOf("week").format(format_str)); //获取本周第一天(周日) 2022-09-11 00:00:00
  console.log(d2.endOf("month").format(format_str)); //获取本周周一0时0分0秒 2022-09-30 23:59:59

  // 获取月份中的天数
  console.log(d2.daysInMonth()); //30

  //增减时间‌  Day.js 对象不可变,所有操作返回新实例
  console.log(d2.add(1, "years").add(1, "months").add(1, "hours").format(format_str)); //2023-10-16 01:00:00
  console.log(d2.subtract(1, "days").subtract(1, "minutes").subtract(1, "seconds").format(format_str)); //2022-09-13 23:58:59

  // 判断时间顺序
  console.log(d1.isBefore(d2)); //false
  console.log(d1.isAfter(d2)); //true

  //获取时间差
  console.log(d2.diff(d1)); // 返回毫秒数
  console.log(d2.diff(d1, "months"));
  console.log(d2.diff(d1, "weeks"));
  console.log(d2.diff(d1, "days"));
  console.log(d1.diff(d2, "days"));
</script>

Moment.js 与 Day.js 核心区别对比

  • 体积与加载性能‌:‌Day.js‌:仅 ‌2KB‌(Gzip 后),体积轻量,适合对资源敏感的项目。‌Moment.js‌:约 ‌60KB‌(未压缩版本近 200KB),体积较大,可能影响页面加载速度。
  • 不可变性设计‌:‌Day.js‌:‌不可变对象‌,所有操作返回新实例,避免副作用(如 add() 不修改原对象)。‌Moment.js‌:‌可变对象‌,部分方法直接修改原实例(如 add() 改变自身值)。
  • 插件与扩展性‌:‌Day.js‌:‌模块化插件机制‌,核心仅提供基础功能,需按需加载时区、周数等插件。‌Moment.js‌:‌全量内置功能‌,无需额外配置即可使用完整功能,但冗余代码较多。
  • 性能表现‌:‌Day.js‌:轻量代码结构带来更优的运行时性能,适合高频次日期操作场景。‌Moment.js‌:体积与历史设计导致性能稍逊,尤其在复杂计算时延迟更明显。
posted @ 2022-11-16 22:10  carol2014  阅读(92)  评论(0)    收藏  举报