dayjs简介
- 体积小: 仅有2kb,下载、解析和执行更少的 JavaScript
- 易上手: 一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样。
- 不可变: 所有的 API 操作都将返回一个新的 Dayjs 对象,避免bug的产生,节约调试时间
- 多平台: Day.js 可以运行在浏览器和 Node.js 中。
安装
下载
npm install dayjs
引入项目
import dayjs from 'dayjs'
dayjs()
基本使用
解析时间
day.js解析传入的参数,并返回Day.js对象
// 不传参数直接调用 dayjs() 将返回一个包含当前日期和时间的 Day.js 对象。
dayjs()
// 等同于如下调用方式
dayjs(new Date())
// 传入时间字符串
dayjs('2023/08/10')
dayjs('2023-08-10 08:08:08')
dayjs('2018-04-13 19:18:17.040+02:00')
// 传入毫秒时间戳(13位)
dayjs(1318781876406)
// 传入秒时间戳(10位)
dayjs.unix(1318781876)
// 传入Date对象
dayjs(new Date(2023, 8, 1))
通过.isValid()验证传入的参数是否能被解析成一个时间日期
dayjs('2022-01-33').isValid() // true
dayjs('invalud string').isValid() // false
获取
dayjs提供了一系列api来从dayjs对象中得到年月日、时分秒、周等信息。
// 获取年
dayjs().year() // 2023
// 获取月 0-11
dayjs().month() // 7
// 获取月份里的日期 1-31
dayjs().date() // 10
// 获取小时
dayjs().hour()
// 获取分钟
dayjs().minute()
// 获取秒
dayjs().second()
// 获取一周星期几 0(星期天)到6(星期六)
dayjs().day()
格式化
项目中对时间格式化是最常见的场景,dayjs返回的是dayjs对象,需要通过.format方法来指定格式化的方式。
dayjs().format() // 2023-08-11T13:48:51+08:00
dayjs().format('YYYY-MM-DD') // 2023-08-11
dayjs().format('YYYY/MM/DD') // 2023/08/11
dayjs('2019-01-25').format('DD/MM/YYYY') // '25/01/2019'
// 字符放在方括号中,即可原样返回而不被格式化替换 (例如, [MM])。
dayjs('2019-01-25').format('[YYYYescape] YYYY-MM-DDTHH:mm:ssZ[Z]')
// 'YYYYescape 2019-01-25T00:00:00-02:00Z'
差异diff
有时候常常需要知道一个日期距离另一个日期过了多久,以及两个日期之间的差异
// 返回指定单位下两个日期时间之间的差异,默认返回毫秒数,
const date1 = dayjs('2019-01-25')
const date2 = dayjs('2018-06-05')
date1.diff(date2) // 20214000000 默认单位是毫秒
// 等同于传入第二个参数millisecond
date1.diff(date2, '等同于传入第二个参数millisecond') // 20214000000 默认单位是毫秒
// 要获取其他单位下的差异,则在第二个参数传入相应的单位
(day、month、year、week、hour、minute、second、millisecond)
date1.diff(date2, 'day')
date1.diff(date2, 'month')
date1.diff(date2, 'year')
date1.diff(date2, 'week')
date1.diff(date2, 'hour')
date1.diff(date2, 'minute')
date1.diff(date2, 'second')
date1.diff(date2, 'millisecond')
比较
判断两个日期之差
// 默认比较毫秒
dayjs().isBefore('2023-08-11')
dayjs().isAfter('2023-07-11')
dayjs().isSame('2023-07-11')
// 从天开始比较
dayjs().isBefore('2023-08-11', 'day')
dayjs().isAfter('2023-07-11', 'day')
dayjs().isSame('2023-07-11', 'day')
更改
有的时候需要增加、减少一定的时间来获取一个新的时间
- 支持day、week、month、year、hour、minute、second等多种时间单位
// 在当前日期增加add
dayjs().add(7, 'day')
dayjs().add(7, 'month')
dayjs().add(7, 'year')
dayjs().add(7, 'hour')
dayjs().add(7, 'minute')
dayjs().add(7, 'second')
// 在当前日期减少subtract
dayjs().subtract(7, 'day')
dayjs().subtract(7, 'month')
dayjs().subtract(7, 'year')
dayjs().subtract(7, 'hour')
dayjs().subtract(7, 'minute')
dayjs().subtract(7, 'second')
高级操作
dayjs提供了一些插件来实现一些额外的查询和判断操作
获取当前日期是该年的第几天
import dayOfYear from 'dayjs/plugin/dayOfYear'
dayjs.extend(dayOfYear)
// 2023-8-10 是2023年的第 222 天
dayjs().dayOfYear() //222
获取当前日期是该年的第几周
import weekOfYear from 'dayjs/plugin/weekOfYear'
dayjs.extend(weekOfYear)
dayjs('2018-06-27').week() // 26
判断该年是否是闰年
import isLeapYear from 'dayjs/plugin/isLeapYear'
dayjs.extend(isLeapYear)
dayjs().isLeapYear()
判断一个日期是否在其他两个的日期之间
import isBetween from 'dayjs/plugin/isBetween'
dayjs.extend(isBetween)
dayjs().isBetween('2023-08-11','2023-08-12')
判断一个日期是否是今天、昨天、明天
import isToday from 'dayjs/plugin/isToday'
import isTomorrow from 'dayjs/plugin/isTomorrow'
import isYesterday from 'dayjs/plugin/isYesterday'
dayjs.extend(isToday).extend(isYesterday).extend(isTomorrow)
dayjs().isToday() // true
dayjs().add(1, 'day').isTomorrow() // true
dayjs().add(-1, 'day').isYesterday() // true
判断一个日期是否和另一个提供的日期时间相同或在其之后(之前)
import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'
import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'
dayjs.extend(isSameOrAfter).extend(isSameOrBefore)
// 比较时间
dayjs().isSameOrAfter('2023-08-11')
dayjs().isSameOrBefore('2023-08-11')
// 从月开始比较
dayjs().isSameOrAfter('2023-08-11', 'month')
dayjs().isSameOrBefore('2023-08-11', 'month')
// 从年开始比较
dayjs().isSameOrAfter('2023-08-11', 'year')
dayjs().isSameOrBefore('2023-08-11', 'year')
距今过去多久
通过relativeTime插件可以获取一个时间距今多久,或距未来某个时间多久
import relativeTime from 'dayjs/plugin/relativeTime'
// 现在到当前实例的相对时间fromNow
dayjs.extend(relativeTime)
dayjs('1999-08-01').fromNow() // 24 years ago
dayjs('1999-08-01').fromNow(true) // 24 years
dayjs('2022-08-01').fromNow() // a year ago
// 某个日期到当前时间的相对时间from
const a = dayjs('2000-01-01')
dayjs('1999-01-01').from(a) // 1 年前
// 当前实例到现在的相对时间 toNow
dayjs('1999-01-01').toNow() // 24 年后
// 某个日期到当前日期的相对时间 to
const a = dayjs('2000-01-01')
dayjs('1999-01-01').to(a) // 1 年后
自定义返回的格式
默认情况下返回的“24 years ago”并不是我们想要的返回,我们需要“24年前”或者仅仅返回24,那么就可以通过updateLocale插件来自定义输出
import updateLocale from 'dayjs/plugin/updateLocale'
dayjs.updateLocale('en', {
relativeTime: {
future: 'in %s',
past: '%s 前',
s: 'a few seconds',
m: 'a minute',
mm: '%d minutes',
h: 'an hour',
hh: '%d hours',
d: 'a 天',
dd: '%d 天',
M: 'a month',
MM: '%d months',
y: '1 年', // 18个月以内返回 一年前
yy: '%d 年' // xx年前
}
})
dayjs.extend(relativeTime)
dayjs('1999-08-01').fromNow() // 24年前
—— 公众号「风度前端」 ——
为每一个有志优秀的「前端er」引路领航,筑梦心声。
Just to be an excellent front end engineer!