前端好用插件----dayjs(日期处理相似功能插件momentjs)

705 阅读3分钟

1.使用背景

dayjs是我从事前端开发,在做第一个项目时就使用的插件,它是一个极简的JavaScript库,文件大小只有2KB左右。对于日期、时间的转化、计算、格式变更十分便捷好用,,可以节约大量在处理时间方面的工作时间。是我目前使用过对于时间处理非常好用的插件,其他针对时间处理的好用插件欢迎推荐。

2.Dayjs简介

1.Dayjs中文网地址:https://dayjs.fenxianglu.cn/

2.dayjs文件大概只有2KB左右,很轻便;而且所有更改Day.js对象的API操作都将返回一个新的实例。这有助于防止错误和避免长时间的调试会话。按F12打开浏览器控制台就可直接调试。代替修改本地Date.prototype,Day.js对Date对象进行了封装,只需要调用Dayjs()即可.

Day.js对象是不可变的,也就是说,以某种方式改变Day.js对象的所有API操作都将返回它的一个新实例

3.举个例子:(日期格式化)

dayjs().format();                                     // 2020-09-08T13:42:32+08:00
dayjs().format('YYYY-MM-DD');                         // 2020-09-08
dayjs().format('YYYY-MM-DD HH:mm:ss');                // 2020-09-08 13:47:12
dayjs(1318781876406).format('YYYY-MM-DD HH:mm:ss');   // 2011-10-17 00:17:56

3.使用方法:

1.安装:

npm install dayjs || cnpm install dayjs -S || yarn add dayjs || pnpm add dayjs

2.引入:(具体的建议去官网看,目前支持微信小程序、ts、浏览器等)

var dayjs = require('dayjs')
// import dayjs from 'dayjs' // ES 2015
dayjs().format()

4.实例

获取当前日期和时间的day.js对象。

var now = dayjs()

目前支持将传入的ISO 8601 (opens new window)格式的字符串、包含本地化语言的日期字符串、时间戳解析出想要的格式:

dayjs('2018 三月 15', 'YYYY MMMM DD', 'zh-cn')

在dayjs()中最后一个参数传入布尔值会开启严格解析模式严格解析要求格式和输入内容完全匹配,包括分隔符。

dayjs('1970-00-00', 'YYYY-MM-DD').isValid() // true
dayjs('1970-00-00', 'YYYY-MM-DD', true).isValid() // false
dayjs('1970-00-00', 'YYYY-MM-DD', 'es', true).isValid() // false

如果您不知道输入字符串的确切格式,但知道它可能是几种中的一种,可以使用数组传入多个格式。

dayjs("12-25-2001", ["YYYY", "YYYY-MM-DD"], 'es', true);

里面还有许许多多功能欢迎去看文档。

对比:获取几天前或者几天后的某个日期,并对日期格式做出处理。 自己写函数代码:

getDay(num, str) {
  let today = new Date();
  let now = today.getTime();
  let ms = 24 * 3600 * 1000 * num;
  today.setTime(parseInt(now + ms));
  let oYear = today.getFullYear();
  let oMoth = (today.getMonth() + 1).toString();
  let oDay = today.getDate().toString();
  if (oMoth.length <= 1) oMoth = "0" + oMoth;
  if (oDay.length <= 1) oDay = "0" + oDay;
  return oYear + str + oMoth + str + oDay;
},

使用dayjs()

dayjs().subtract(1,'days').format('日期格式')

非常简洁好用。

一些经典的操作:

dayjs().format('YYYY年MM月DD日 HH:mm:ss') // 格式化
dayjs().add(7, 'days') // 往后7天
dayjs().subtract(1, 'months') // 上个月
dayjs().startOf('months') // 获取一月初 
dayjs().endOf('year') // 获取一年年末
dayjs('2010-10-20').isBefore('2010-10-21') // 早于
dayjs('2010-10-20').isAfter('2010-10-19') // 晚于
dayjs().isLeapYear() // 闰年

与之相似功能的插件有:momentjs,使用方法类似,地址:momentjs.bootcss.com/