四时宝库

程序员的知识宝库

Day.js(2KB的时间处理库)常用方法总结

01、简介

Day.js是一个轻量的处理时间和日期的 JavaScript 库。 官方文档地址:https://day.js.org/docs/zh-CN/installation/installation

02、安装

方式一:通过CDN引入Day.js

<script src="https://cdn.bootcdn.net/ajax/libs/dayjs/1.11.6/dayjs.min.js"></script>

方式二:通过npm安装Day.js

这里以Vue项目为例。

在Vue项目中引入Day.js的步骤如下: 第一步:通过npm命令安装Day.js。

$ npm install dayjs

第二步:在main.js文件中配置Day.js。

import dayjs from 'dayjs';
Vue.prototype.dayjs = dayjs;

经过如上两步,就可以直接通过this.dayjs()使用Day.js了。比如获取时间戳(秒):

const time = this.dayjs().unix();

03、获取当前时间

1、获取当前时间(dayjs对象):

dayjs()

当没有参数时,会返回一个 dayjs 实例对象,且为当前日期和时间。 输出结果:

2、获取当前时间(原生Date对象)

dayjs().toDate()

输出结果:

3、获取当前时间(字符串,年、月、日)

dayjs().format('YYYY-MM-DD')

输出结果:

4、获取当前时间(字符串,年、月、日、时、分、秒)

dayjs().format('YYYY-MM-DD HH:mm:ss')

输出结果:

5、获取时间戳(秒)

dayjs().unix()

输出结果:

6、获取时间戳(毫秒)

dayjs().valueOf()

输出结果:

04、获取&设置年、月、日、时、分、秒、毫秒

编写示例时的日期是2022年11月10日10点。

// 年份
dayjs().year() // 输出结果:2022

// 月份
dayjs().month() // 输出结果:10

// 日
dayjs().date() // 输出结果:10

// 时
dayjs().hour() // 输出结果:10

// 分
dayjs().minute() // 输出结果:10

// 秒
dayjs().second() // 输出结果:15

// 毫秒
dayjs().millisecond() // 输出结果:952

说明: 1、以上年、月、日、时、分、秒的方法,没有参数时是获取值,有参数时是设置值。

// 设置年份
dayjs().year(2022)

// 设置月份
dayjs().month(10)

// 设置日
dayjs().date(10)

// 设置时
dayjs().hour(10)

// 设置分
dayjs().minute(10)

// 设置秒
dayjs().second(15)

// 设置毫秒
dayjs().millisecond(952)

2、获取月份时返回的月份值比实际月份小1,即当前月份为11月时,month()返回的值为10。

05、时间操作

1、添加 Day.js获取一段时间后的时间,时间单位支持年、月、日、时、分、秒、毫秒、周、季度,返回的是 dayjs 对象。例如获取的是7天后的时间:

dayjs().add(7, 'day')

支持的时间单位如下:

单位

简写

说明

day

d

week

w

month

M

quarter

Q

季度

year

y

hour

h

小时

minute

m

分钟

second

s

millisecond

ms

毫秒

2、开始时间 获取当天的开始时间,返回当天的0点0分0秒:

dayjs().startOf('day')

支持的时间单位如下:

单位

缩写

说明

year

y

January 1st, 00:00 this year

month

M

the first day of this month, 00:00

week

w

the first day of this week, 00:00 (locale aware)

date

D

00:00 today

day

d

00:00 today

hour

h

now, but with 0 mins, 0 secs, and 0 ms

minute

m

now, but with 0 seconds and 0 milliseconds

second

s

now, but with 0 milliseconds

3、结束时间 获取当天的结束时间,返回当天的23点59分59秒999毫秒:

dayjs().endOf('day')

支持的时间单位同获取开始时间。

4、获取两个日期间的时间差

const date1 = dayjs("2022-11-10")
const date2 = dayjs("2022-10-10")
date1.diff(date2, "day") // 输出结果:31

06、格式化

dayjs.format('YYYY-MM-DD HH:mm:ss')

以下是常用的时间格式单位:

格式

输出

描述

YY

19

两位数年份

YYYY

2019

四位数年份

M

1~12

月份,从1开始

MM

01~12

月份,两位数

D

1~31

月份里的一天

DD

01~31

月份里的一天,两位数

H

0~23

小时

HH

00~23

小时,两位数

h

1~12

小时,12小时制

hh

01~12

小时,12小时制,两位数

m

0~59

分钟

mm

00~59

分钟,两位数

s

0~59

ss

00~59

秒,两位数

SSS

000~999

毫秒,三位数

07、附录

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Day.js常用方法总结</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/dayjs/1.11.6/dayjs.min.js"></script>
  </head>
  <body>
    <script>
      console.log("########## 获取当前时间(返回dayjs对象) ##########");
      console.log(dayjs());
      console.log("########## 获取当前时间(返回原生Date对象) ##########");
      console.log(dayjs().toDate());
      console.log("########## 获取当前时间(年月日时分秒,字符串) ##########");
      console.log(dayjs().format("YYYY-MM-DD HH:mm:ss"));
      console.log("########## 获取当前时间(年月日,字符串) ##########");
      console.log(dayjs().format("YYYY-MM-DD"));
      console.log("########## 获取时间戳 (秒) ##########");
      console.log(dayjs().unix());
      console.log("########## 获取时间戳 (毫秒) ##########");
      console.log(dayjs().valueOf());
      console.log("########## 年 ##########");
      console.log(dayjs().year());
      console.log("########## 月 ##########");
      console.log(dayjs().month());
      console.log("########## 日 ##########");
      console.log(dayjs().date());
      console.log("########## 时 ##########");
      console.log(dayjs().hour());
      console.log("########## 分 ##########");
      console.log(dayjs().minute());
      console.log("########## 秒 ##########");
      console.log(dayjs().second());
      console.log("########## 毫秒 ##########");
      console.log(dayjs().millisecond());
      console.log("########## 在日期的基础上加上7天 ##########");
      console.log(dayjs("2022-11-10").add(7, "day"));
      console.log("########## 获取当天的开始时间,并格式化 ##########");
      console.log(dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss.SSS"));
      console.log("########## 获取当天的结束时间,并格式化 ##########");
      console.log(dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss.SSS"));
      console.log("########## 获取两个日期间的时间差 ##########");
      const date1 = dayjs("2022-11-10");
      const date2 = dayjs("2022-10-10");
      console.log(date1.diff(date2, "day"));
    </script>
  </body>
</html>




发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言
    友情链接