Day.js的使用

953 阅读3分钟

Day.js是前端一个轻量的处理时间和日期的 JavaScript 库

优势

  • 体积小,才2kb
  • 与Moment.js库的Api完全一致,利于开发人员的过渡
  • 每次使用day.js操作后均会返回一个新Dayjs对象,方便使用链式调用
  • 支持国际化以及支持目前所有主流浏览器

包安装及引入

NPM

npm i dayjs --save

import dayjs from 'dayjs'
或者
const dayjs = require('dayjs')
dayjs().format()

CDN

<script src="https://unpkg.com/dayjs@1.8.21/dayjs.min.js"></script> 
<script>dayjs().format()</script>

下载地址

www.jsdelivr.com/package/npm…

国际化

NodeJs

import 'dayjs/locale/zh-cn'
dayjs.locale('zh-cn')

CDN

<script src="https://unpkg.com/dayjs@1.8.21/locale/zh-cn.js"></script> 
<script>dayjs.locale('zh-cn')</script>

dayjs相关api的使用

生成类

生成当前时间的dayjs对象

const now = dayjs()
等同于
const now = datjs(new Date())

其返回一个包含当前日期和时间的 Day.js 对象。

生成某个时间的dayjs对象

    // 可传入一个标准时间字符串
    const date = dayjs('2023-2-28')
    // 可传入一个时间戳,参数类型必须为number
    const date = dayjs(1318781876406)
    // 可传入一个时间对象
    const date = dayjs(new Date(2023,2,28))

dayjs的克隆

const a = dayjs()
const b = a.clone()

a 和 b 是两个独立的 Day.js对象

时间校验,用于判断是时间格式

 dayjs('2023-2-28').isValid() // true
 dayjs('aaa').isValid() // false

获取、设置类

获取设置秒

// 获取
dayjs().second()
// 设置
dayjs().second(1)

获取设置分

// 获取
dayjs().minute()
// 设置
dayjs().minute(1)

获取设置时

// 获取
dayjs().hour()
// 设置
dayjs().hour(1)

获取设置日

// 获取
dayjs().date()
// 设置
dayjs().date(1)

获取设置月

// 获取 注:月份从0开始计算,0代表1月份
dayjs().month()
// 设置
dayjs().month(0)

获取设置月

// 获取 注:月份从0开始计算,0代表1月份
dayjs().year()
// 设置
dayjs().year(2023)

Get方法

dayjs().get('year')  // 年
dayjs().get('month') // 月
dayjs().get('date') // 日
dayjs().get('hour') // 时
dayjs().get('minute') // 分
dayjs().get('second') // 秒
dayjs().get('millisecond') // 毫秒

Set方法

dayjs().set('date', 1)
dayjs().set('month', 3)
dayjs().set('second', 30)
// 或者使用链式调用
dayjs().set('date', 1).set('month', 3).set('second', 30)

解析类

format方法

根据传入的占位符返回格式化后的日期


YYYY-MM-DD HH:mm:ss
dayjs().format('YYYY-MM-DD HH:mm:ss') // 2023-02-27 14:12:29
dayjs('2019-01-25').format('DD/MM/YYYY') // 25/01/2019

diff方法 返回指定单位下两个日期时间之间的差值

// 返回时间戳差值
dayjs('2019-01-25').diff(dayjs('2018-06-05')) // 20214000000 默认单位是毫秒
// 传入参数返回具体月份,日期等差异
dayjs('2019-01-25').diff(dayjs('2018-06-05'), 'month') // 7
// 获取具体精确的浮点数
dayjs('2019-01-25').diff(dayjs('2018-06-05'), 'month', true) // 7.645161290322581

项目中比较常用的方法

const dateFormat = (time, format = 'YYYY-MM-DD HH:mm:ss') => {
  return time ? dayjs(time).format(format) : ''
}

const YYYY_MM_DD = _ => dayjs(_).format('YYYY-MM-DD')

const YYYY_MM_DD_ZH = _ => dayjs(_).format('YYYY年MM月DD日')

const YYYY_MM_DD_HH_MM = _ => dayjs(_).format('YYYY-MM-DD HH:mm')

const YYYY_MM_DD_HH_MM_SS = _ => dayjs(_).format('YYYY-MM-DD HH:mm:ss')

const YYYY_MM_DD_23_59_59 = _ => dayjs(_).format('YYYY-MM-DD 23:59:59')

const YYYY_MM_DD_00_00_00 = _ => dayjs(_).format('YYYY-MM-DD 00:00:00')

const HH_MM = _ => dayjs(_).format('HH:mm')

const HH_MM_SS = _ => dayjs(_).format('HH:mm:ss')

const DIY_TIME = (_, $) => dayjs(_).format($)

const YYYY_MM_DD_HH_MM_HH_MM = (start, end) => YYYY_MM_DD_HH_MM(start) + '-' + HH_MM(end)