当前位置：首页 > news >正文

Day.js时间插件的安装引用与常用方法大全

news 2025/9/17 8:25:44

🚀 个人简介：某大型国企资深软件研发工程师，信息系统项目管理师、CSDN优质创作者、阿里云专家博主，华为云云享专家，分享前端后端相关技术与工作常见问题~

💟 作者：码喽的自我修养🥰
📝 专栏：常用组件库与实用工具 🎉

🌈 创作不易，如果能帮助到带大家，欢迎 收藏+关注 哦 💕

🌈🌈文章目录

01、简介

02、安装

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

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

03、获取当前时间

1、获取当前时间（dayjs对象）：

2、获取当前时间（原生Date对象）

3、获取当前时间（字符串，年、月、日）

4、获取当前时间（字符串，年、月、日、时、分、秒）

5、获取时间戳（秒）

6、获取时间戳（毫秒）

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

05、时间操作

1、添加

2、开始时间

3、结束时间

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

06、格式化

07、附录

01、简介

Day.js 是一个轻量级，易于使用的 JavaScript 日期库，提供了强大的日期和时间处理功能。它具有简洁的 API，支持链式操作和不可变性。Day.js 支持国际化显示和各种格式的日期和时间的解析和格式化。它还提供了丰富的插件系统，可以轻松扩展功能。无论是在 Web 还是 Node.js 环境下，Day.js 都是一个不错的选择

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、获取&设置年、月、日、时、分、秒、毫秒

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

// 年份
dayjs().year() // 输出结果：2024// 月份
dayjs().month() // 输出结果：10// 日
dayjs().date() // 输出结果：10// 时
dayjs().hour() // 输出结果：10// 分
dayjs().minute() // 输出结果：10// 秒
dayjs().second() // 输出结果：15// 毫秒
dayjs().millisecond() // 输出结果：952

说明：

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

// 设置年份
dayjs().year(2024)// 设置月份
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')

支持的时间单位如下：

2、开始时间

获取当天的开始时间，返回当天的0点0分0秒：

dayjs().startOf('day')

支持的时间单位如下：

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')

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

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>

以上方法其实足够大家日常使用了，如果想要查看更多内容，给大家推荐官网：

安装 · Day.js

到此这篇文章就介绍到这了,更多精彩内容请关注本人以前的文章或继续浏览下面的文章，创作不易，如果能帮助到大家,希望大家点点收藏+关注~💕

更多专栏订阅推荐：

🥕 JavaScript深入研究

👍 前端工程搭建
💕 vue从基础到起飞

✈️ HTML5与CSS3

🖼️ JavaScript基础

⭐️ uniapp与微信小程序

📝 前端工作常见问题与避坑指南

✍️ GIS地图与大数据可视化

📚 常用组件库与实用工具

💡 java入门到实战

Day.js时间插件的安装引用与常用方法大全

🚀 个人简介：某大型国企资深软件研发工程师，信息系统项目管理师、CSDN优质创作者、阿里云专家博主，华为云云享专家，分享前端后端相关技术与工作常见问题~ 💟 作者：码喽的自我修养&#x1f9…...

编程日记 2024/9/23 18:00:35

aws 容器镜像仓库操作

aws 容器镜像仓库产品叫ECR，官方文档参考：Amazon Elastic Container Registry。 1）账号认证 # 配置aws命令 $ aws configure set aws_access_key_id ${ak} $ aws configure set aws_secret_access_key ${sk} 2）镜像仓库登陆 #…...

编程日记 2024/9/23 17:59:34

学习记录：js算法（四十一）：基于时间的键值存储

文章目录基于时间的键值存储网上思路总结基于时间的键值存储设计一个基于时间的键值数据结构，该结构可以在不同时间戳存储对应同一个键的多个值，并针对特定时间戳检索键对应的值。实现 TimeMap 类： TimeMap() 初始化数据结构对象void se…...

编程日记 2024/9/23 17:54:28

C语言 | Leetcode C语言题解之第424题替换后的最长重复字符

题目： 题解： int characterReplacement(char* s, int k) {int num[26];memset(num, 0, sizeof(num));int n strlen(s);int maxn 0;int left 0, right 0;while (right < n) {num[s[right] - A];maxn fmax(maxn, num[s[right] - A]);if (right - …...

编程日记 2024/9/23 17:53:26

大数据时代的PDF解析：技术与挑战

在大数据时代，海量信息以不同格式存储，其中 PDF 文件凭借其广泛应用成为了各种业务场景下的主要文档格式。无论是政府文件、企业报告，还是学术论文和技术文档，PDF 都是信息交流的重要媒介。然而，随着信息的爆炸式增长&…...

编程日记 2024/9/23 17:51:24

《nmap 命令全解析：网络探测与安全扫描的利器》

文章目录一、引言二、nmap 命令概述三、nmap 基本用法（一）安装 nmap（二）简单扫描示例四、nmap 常见参数（一）-sS（TCP SYN 扫描）（二）-sT（TCP 连接…...

编程日记 2024/9/23 17:50:23

2024年华为OD机试真题-斗地主之顺子-Python-OD统一考试（E卷）

最新华为OD机试考点合集：华为OD机试2024年真题题库（E卷+D卷+C卷）_华为od机试题库-CSDN博客每一题都含有详细的解题思路和代码注释，精选c++、JAVA、Python三种语言解法。帮助每一位考生轻松、高效刷题。订阅后永久可看，持续跟新。题目描述在斗地主只扑克牌游戏中，…...

编程日记 2024/9/23 17:49:22

亲测有效，长期有效的RTSP流地址公网RTSP地址，各种类型的视频源

我们经常需要做一些实时视频流的测试，但是手边又没有办法及时弄到一个摄像机，我们经常会去搜索一下“公网RTSP地址”，但是大部分现在都失效了，有什么办法能够让我们快速构建一个RTSP流，点几下就能直接用？ …...

编程日记 2024/9/23 17:47:20

Excel常用函数大全

Excel常用函数介绍与示例应用在Excel中，函数是进行数据处理和分析的强大工具。对于新手来说，掌握一些基本的函数使用方法能够大大提升工作效率。以下是一份通俗易懂、适合新手的Excel函数使用方法总结： 1. 求和函数（SUM&#x…...

编程日记 2024/9/23 17:45:16

领夹麦克风哪个品牌好，无线领夹麦克风品牌排名，麦克风品牌大全

无线领夹麦克风因其便携性和隐蔽性，越来越受到演讲者和表演者的青睐。但是，随着市场上品牌和型号的增多，质量也变得参差不齐。许多用户在选购时，会因为缺乏了解而选择到性能不佳的产品，影响声音的清晰度和稳定性。下面…...

编程日记 2024/9/23 17:43:14

【C语言零基础入门篇 - 15】：单链表

文章目录单链表链表的基本概念单链表功能的实现单链表的初始化单链表新结点的创建单链表头插法单链表的输出单链表的查找单链表修改单链表的删除单链表所有数据结点释放源代码单链表链表的基本概念一、什么是链表？ 链表是数据结构中线性表的一种，其…...

编程日记 2024/9/23 17:40:11

Linux主流Web服务器：你选择哪一款？

在Linux环境下，选择Web服务器通常取决于特定需求、资源限制、以及对性能的期望。以下是对几款主流Linux Web服务器的详细分析： 1. Apache HTTP Server - 特点：Apache是功能最全面的Web服务器之一，支持模块化架构，拥…...

编程日记 2024/9/23 17:39:10

光耦知识分享：解读晶体管光耦主要性能指标

晶体管光耦是一种常用的光电耦合器，用于隔离和传输电信号，它包含有光电发射管和接收晶体管两个主要部分。解读晶体管光耦的主要指标有助于了解其性能和应用范围，主要指标包括： 最大工作电压（V_R_MAX）&…...

编程日记 2024/9/23 17:38:09

laravel public 目录获取

在Laravel框架中，public目录是用来存放公共资源的，如CSS、JS、图片等。你可以通过多种方式获取public目录的路径。方法一：使用helper函数public_path() $path public_path(); 方法二：使用Request类 $path Request::root().…...

编程日记 2024/9/23 17:34:03

强化学习策略买卖股票的效果如何？

Github 项目： GitHub - daocodedao/stable-baselines-stock: 深度强化学习自动炒股主体参考了 https://github.com/wangshub/RL-Stock，修改了一些 requirements 修改到新版本支持 macstable-baselines 改为 stable-baselines3 使用强化学习预测股价…...

编程日记 2024/9/23 17:32:00

Kotlin 基本介绍(一)

导读大纲 1.1.1 Kotlin 是安全的1.1.2 Kotlin 具有互操作性1.1.3 什么是 idiomatic Kotlin？ 1.1.1 Kotlin 是安全的一般来说,当我们说一种编程语言是安全的我们指的是它的设计可以防止程序中出现某些类型的错误当然,这并不是绝对的;没有一种语言能防止所有可能出现…...

编程日记 2024/9/23 17:29:58

Cocos Creator发布Moloco平台试玩广告（PlayableAd）

官方文档主要遇到了两点问题。 1.HTML文件内的body需要注入 <script>window.FBPlayableOnCTAClick () > {(typeof FbPlayableAd undefined) ? alert(FBPlayableAd.onCTAClick) : FbPlayableAd.onCTAClick()}</script> 2.跳转商店使用 window.parent.postM…...

编程日记 2024/9/23 17:27:55

七种修复错误：由于找不到msvcr110.dll 无法继续执行的方法

当你在运行某些程序时遇到“找不到msvcr110.dll”的错误提示，这通常意味着你的系统缺少了Microsoft Visual C 2012 Redistributable包中的一个重要文件。这个DLL文件是Microsoft Visual C Redistributable的一部分，用于支持许多使用Visual C编写的软件和…...

编程日记 2024/9/23 17:26:53

Python模拟鼠标轨迹[Python]

一.鼠标轨迹模拟简介传统的鼠标轨迹模拟依赖于简单的数学模型，如直线或曲线路径。然而，这种方法难以捕捉到人类操作的复杂性和多样性。AI大模型的出现，能够通过深度学习技术，学习并模拟更自然的鼠标移动行为。二.鼠标轨迹算法实…...

编程日记 2024/9/23 17:25:52

Ubuntu搭建java开发环境

一：Ubuntu安装 1、下载Ubuntu 24.04.1 LTS 官网下载地址：https://releases.ubuntu.com/24.04.1/ubuntu-24.04.1-desktop-amd64.iso 可以直接点击这里下载 2、使用VMware安装新建虚拟机之后一直下一步，到如下界面，选择刚刚…...

编程日记 2024/9/23 17:24:50

Docker 离线安装指南

参考文章 1、确认操作系统类型及内核版本 Docker依赖于Linux内核的一些特性，不同版本的Docker对内核版本有不同要求。例如，Docker 17.06及之后的版本通常需要Linux内核3.10及以上版本，Docker17.09及更高版本对应Linux内核4.9.x及更高版本。…...

编程新知 2025/9/14 3:25:53

【入坑系列】TiDB 强制索引在不同库下不生效问题

文章目录背景SQL 优化情况线上SQL运行情况分析怀疑1：执行计划绑定问题？尝试：SHOW WARNINGS 查看警告探索 TiDB 的 USE_INDEX 写法Hint 不生效问题排查解决参考背景项目中使用 TiDB 数据库，并对 SQL 进行优化了，添加了强制索引。 UAT 环境已经生效，但 PROD 环境强制索…...

编程新知 2025/9/13 17:43:37

深入理解JavaScript设计模式之单例模式

目录什么是单例模式为什么需要单例模式常见应用场景包括单例模式实现透明单例模式实现不透明单例模式用代理实现单例模式javaScript中的单例模式使用命名空间使用闭包封装私有变量惰性单例通用的惰性单例结语什么是单例模式单例模式（Singleton Pattern&#…...

编程新知 2025/9/11 12:54:47

Java多线程实现之Callable接口深度解析

Java多线程实现之Callable接口深度解析一、Callable接口概述1.1 接口定义1.2 与Runnable接口的对比1.3 Future接口与FutureTask类二、Callable接口的基本使用方法2.1 传统方式实现Callable接口2.2 使用Lambda表达式简化Callable实现2.3 使用FutureTask类执行Callable任务三、…...

编程新知 2025/8/28 7:47:23

相机从app启动流程

一、流程框架图二、具体流程分析 1、得到cameralist和对应的静态信息目录如下：重点代码分析：启动相机前，先要通过getCameraIdList获取camera的个数以及id，然后可以通过getCameraCharacteristics获取对应id camera的capabilities（静态信息）进行一些openCamera前的…...

编程新知 2025/9/16 2:11:19

TRS收益互换：跨境资本流动的金融创新工具与系统化解决方案

一、TRS收益互换的本质与业务逻辑 （一）概念解析 TRS（Total Return Swap）收益互换是一种金融衍生工具，指交易双方约定在未来一定期限内，基于特定资产或指数的表现进行现金流交换的协议。其核心特征包括&am…...

编程新知 2025/8/4 11:36:24

sipsak：SIP瑞士军刀！全参数详细教程！Kali Linux教程！

简介 sipsak 是一个面向会话初始协议 (SIP) 应用程序开发人员和管理员的小型命令行工具。它可以用于对 SIP 应用程序和设备进行一些简单的测试。 sipsak 是一款 SIP 压力和诊断实用程序。它通过 sip-uri 向服务器发送 SIP 请求，并检查收到的响应。它以以下模式之一…...

编程新知 2025/9/13 17:37:48