核心内容摘要
8x8x成人永久免费视频精彩内容尽在这里:重新定义视觉盛宴的极致体验
本文简介点赞 关注 收藏 学会了本文主要介绍我在工作中使用day.js较多的方法。
本文并不能代替day.js官方文档日常工作中该查文档的还是要查文档。
本文是写给刚接触day.js的工友让这部分工友能更顺利上手day.js。
本文不涉及day.js插件王国之泪通关后再写这部分吧。
day.js 简介day.js是一个专门处理日期和时间的工具库它的体积只有 2KB非常小。
安装 day.jsnpm安装npm install dayjs --save使用// 引入 dayjsimportdayjsfromdayjs// 输出当前时间console.log(dayjs())cdn访问 https://www.jsdelivr.com/package/npm/dayjs 下载最新版本的 Day.js。
scriptsrchttps://cdn.jsdelivr.net/npm/dayjs1/dayjs.min.js/scriptscript// 输出当前时间console.log(dayjs())/script格式化日期格式前面我们使用dayjs()获取到当前的时间但返回的格式不好看。
// 输出当前时间console.log(dayjs())day.js提供了format()方法可以格式化时间。
《文档Format》format()会返回一个字符串类型的时间。
基础用法// 格式化当前时间console.log(dayjs().format())自定义格式format()支持自定义日期格式点击查看支持的格式常用格式我拷一份放在这里占位符输出详情YY18两位数的年份YYYY2018四位数的年份M
月份从 1 开始MM
月份两位数MMMJan-Dec缩写的月份名称MMMMJanuary-December完整的月份名称D
月份里的一天DD
月份里的一天两位数d
一周中的一天星期天是 0ddSu-Sa最简写的星期几dddSun-Sat简写的星期几ddddSunday-Saturday星期几H
小时HH
小时两位数h
小时, 12 小时制hh
小时, 12 小时制, 两位数m
分钟mm
分钟两位数s
秒ss
秒 两位数SSS
毫秒 三位数Z05:00UTC 的偏移量±HH:mmZZ0500UTC 的偏移量±HHmmAAM PMaam pm知道这些格式我们就可以这样写// 年dayjs().format(YY)// 返回 23 写本文时是2023年dayjs().format(YYYY)// 返回 2023// 月dayjs().format(M)// 返回当前月份
dayjs().format(MM)// 返回当前月份
用MM的话
月前面会补0// 日dayjs().format(D)// 返回当前月份里的天比如今天是5月1号就输出1如果今天是5月20号就输出20dayjs().format(DD)// 返回当前月份里的天用DD的话
天前面会补0// 星期dayjs().format(d)// 返回一周中的一天星期天是 0// 小时dayjs().format(H)// 返回小时
dayjs().format(HH)// 返回小时
小时前面会补0dayjs().format(h)// 返回小时
dayjs().format(hh)// 返回小时
小时前面会补0// 分钟dayjs().format(m)// 返回分钟
dayjs().format(mm)// 返回分钟
分钟前面会补0// 秒dayjs().format(s)// 返回秒
dayjs().format(ss)// 返回秒
秒前面会补0dayjs().format(sss)// 返回毫秒数
需要注意大写M表示月份小写m表示分钟。
大写D表示月份里的一天小写d表示一周中的一天大写H是24小时制小写h是12小时制。
比如下午2点 大写H是14小写h就是2。
如果是使用小写h建议配合A或者a一起使用。
可以将上面的格式组合起来使用/* 目标输出当前年月日时分秒 规则年月日用“-”分隔时分秒用“:“分隔年月日和时分秒之间用空格分隔 */dayjs().format(YYYY-MM-DD hh:mm:ss)/* 目标输出当前年月日 规则年月日用“/”分隔 */dayjs().format(YYYY/MM/DD)/* 目标输出当前年月日 规则使用中文的“年”、“月”、“日”单位 */dayjs().format(YYYY年MM月DD日)dayjs()还接受传入时间参数然后再使用format()进行格式化dayjs(
-
.format(YYYY年MM月DD日)// 返回 2023年05月20日简单吧好用吧format()和其他方法结合起来很好用后面会举例。
获取/设置日期时间前面的例子中我们通过dayjs().format(M)等方法可以获取当前时间或者指定时间的月份等信息。
day.js其实也提供了一些方法可以获取或者设置指定日期时间详情可以看 文档。
我这里举个例子。
// 获取当前月份。
注意月份从0开始0表示1月1表示2月...dayjs().month()// 设置月份dayjs().month(
// 设置完月份后格式化dayjs().month(
.format()这个例子用到month()方法如果不传参就会返回当前日期的月份如果传了参就变成设置月份了。
还有年、日、周、时分秒等其他配置和获取的方法请参考 文档。
日期时间计算日期计算是工作中常用的功能比如计算3天后的日期是多少。
day.js提供了很多方便的方法。
增加日期时间给定一个日期希望获取该日期的后几天或者想获取当前时间的半小时后的时间就可以使用add()方法。
add()方法接收2个参数第一个参数是要增加的时间可以是负值。
第二个参数是时间单位比如day、month等。
第二个参数支持的单位如下单位缩写详情dayd日weekw周monthM月yeary年hourh小时minutem分钟seconds秒millisecondms毫秒其实第二个参数还支持quarter查询季度但需要安装QuarterOfYear插件。
比如获取当前日期的后10天。
dayjs().add(10,day)// 格式化后返回dayjs().add(10,day).format()如果加了10天后夸了月day.js会自动判断的。
比如今天是2023年5月24日加了10天就是2023年6月3日。
获取当前时间的半小时后的时间。
dayjs().add(30,minute)// 或者dayjs().add(
5,hour)如果传入的值是负数那返回的时间就是往前计算的。
比如获取10天前的时间。
dayjs().add(-10,day)使用add()方法第一个参数最好还是传入正数因为想获取之前的时间可以使用subtract()方法。
减少日期时间subtract()方法和add()的用法一样。
subtract()的作用是返回减去一定时间的值。
比如想获取10天前的时间值可以这样写。
dayjs().subtract(10,day)subtract()的第一个参数同样可以传入负数但没必要这么做。
subtract()方法很适合用在日历组件的快捷选项比如获取1周内的时间。
// 当前时间dayjs().format(YYYY-MM-DD hh:mm:ss)// 7天前的时间dayjs().subtract(7,day).format(YYYY-MM-DD hh:mm:ss)获取开始日期时间使用startOf()方法可以获取开始时间日期。
startOf()需要传入一个单位参数这个参数支持以下值单位缩写详情yeary今年一月1日上午 00:00monthM本月1日上午 00:00weekw本周的第一天上午 00:00 (取决于国际化设置)dateD当天 00:00dayd当天 00:00hourh当前时间0 分、0 秒、0 毫秒minutem当前时间0 秒、0 毫秒seconds当前时间0 毫秒其中quarter需要另外安装QuarterOfYear插件isoWeek需要另外安装IsoWeek插件。
比如我要获取当月的1号到今天的日期。
// 今天的日期dayjs().format()// 本月的第一天日期dayjs().startOf(month).format()我在项目中图表部分有时候会有这种需求。
再比如有些时候我们可能想获取当前时间的本周第一天比如今天是2023年5月25号星期4我想看看这周的周一是几号就可以这么写dayjs().startOf(week).format(DD)// 返回 21。
2023年5月21号是星期1获取结束日期时间有获取开始日期时间就有获取结束日期时间。
day.js提供了endOf()方法获取结束日期时间。
比如要获取当前日期的23:59:59。
dayjs().endOf(day).format()endOf()通常会和startOf()结合使用这样就可以获取一个比较完整的时间段。
比如要获取 2020年2月的开始和结束日期。
// 2020年2月开始日期时间 dayjs(2020-
.startOf(month).format() // 2020年2月结束日期时间 dayjs(2020-
.endOf(month).format()像2月这种不能一眼看出有多少天的月份用endOf()方法就非常方便了。
计算2个日期时间差如果要计算2个日期时间的差异可以使用diff()方法。
diff()的语法时间
diff(时间
时间
diff(时间2,时间单位)如果不传第二个参数时间单位默认返回毫秒数。
举个例子计算北京奥运会开幕式到现在过了多少天。
// 北京奥运会开幕时间constopeningDatedayjs(
-
// 当前时间constnowdayjs()// 计算北京奥运开幕式到现在过了多少毫秒now.diff(openingDate)// 计算北京奥运开幕式到现在过了多少天now.diff(openingDate,day)单位时间除了day之外还支持以下单位单位缩写详情dayd日weekwWeek of YearquarterQQuartermonthM月份 (一月 0 十二月
yearyYearhourhHourminutemMinutesecondsSecondmillisecondmsMillisecond日期时间查询查询指定月份有多少天我还记得小学数学老师教我们数一个月有多少天的方法。
举起一个拳头不好意思搞错了。
。
。
从食指往小拇指方向数凸起来的是31天凹下去的是30天2月份除外。
因为有闰年的存在2月的天数是不定的。
day.js提供了daysInMonth()方法可以快速查询指定月份有多少天。
dayjs(2008-
.daysInMonth()// 返回29dayjs(2023-
.daysInMonth()// 返回28查询时间是否在另一个时间之前查询一个时间是否在另一个时间之前用的是isBefore()方法。
比如查询当前日期是否在北京奥运会开幕式之前dayjs().isBefore(dayjs(
-
)isBefore()接受第二个参数时间单位。
比如传入month就通过年和月来对比。
ayjs().isBefore(dayjs(
-
,month)查询时间是否在另一个时间之后查询一个时间是否在另一个时间之后用的是isAfter()方法。
比如查询当前日期是否在北京奥运会开幕式之后dayjs().isAfter(dayjs(
-
)isAfter()也支持传入第二个参数时间单位。
判断两个时间是否相同判断两个时间是否相同使用的方法是isSame()。
isSame()方法默认使用毫秒来判断。
dayjs().isSame(dayjs(
-
)如果想判断年份或者月份是否相同就需要传入第二个参数时间单位。
// 年份相同就返回 true否则返回 falsedayjs().isSame(
,year)// 年份和月份相同才返回 true否则返回 falsedayjs().isSame(
,month)// 年月日都相同才返回 true否则返回 falsedayjs().isSame(
,day)是否在其他两个的日期时间之间判断一个时间是否在某个时间段内需要用到 IsBetween 插件。
如果不想下载这个插件完全可以通过isBefore()和isAfter()组合起来进行判断。
比如判断当前时间是否在2019年 至 2025年之间可以这么写// 当前时间constnowdayjs()// 判断结果now.isAfter(
now.isBefore(
day.js 轻量实用能高效搞定日期格式化、计算与时间查询需求落地时要考虑组件复用、快速部署的工程效率问题。
试试RollCode 低代码平台轻松实现私有化部署、自定义组件、静态页面发布SSG SEO。
点赞 关注 收藏 学会了