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:体积与历史设计导致性能稍逊,尤其在复杂计算时延迟更明显。
浙公网安备 33010602011771号