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

JavaScript日期库之date-fn.js

用官网的话来说,date-fn.js 就是一个现代 JavaScript 日期实用程序库,date-fns 为在浏览器和 Node.js 中操作 JavaScript 日期提供了最全面、但最简单和一致的工具集。那实际用起来像它说的那么神奇呢,下面就一起来看看吧。

 

安装

安装的话就非常简单了,你可以用 npm/cnpm,或者你还可以用 yarn安装。

npm install date-fns --save
cnpm install date-fns --save
yarn add date-fns

引入

需要注意的是,用到的方法都需要在 {}中引入,并且 date-fns 是不支持全局引入的。

import { format } from "date-fns"; // 根据需要引入方法

实例

date-fns 中有非常多的方法可以选择,话不多说,下面直接进入实战开发。

1. 日期格式转换字符串格式

let dateTime = new Date();
console.log(dateTime); // Tue Sep 20 2022 16:08:58 GMT+0800 (中国标准时间)
let currentTime = format(dateTime, "yyyy-MM-dd HH:mm:ss");
console.log(currentTime); // 2022-09-20 16:09:33

 2. 字符串格式转换日期格式

let dateTime = "2022-09-20 16:09:33";
let currentTime = parseISO(dateTime);
console.log(currentTime); // Tue Sep 20 2022 16:09:33 GMT+0800 (中国标准时间)

 3. 现有日期做加/减 

方法描述
addYears加年
subYears减年
addMonths加月
subMonths减月
addWeeks加周
subWeeks减周
addDays加天
subDays减天
addHours加小时
subHours减小时
addMinutes加分钟
subMinutes减分钟

 例:当前日期减一天

let dateTime = new Date("2022-09-20 16:09:33");
let currentTime = format(subDays(dateTime, 1), "yyyy-MM-dd HH:mm:ss");
console.log(currentTime); // 2022-09-19 16:09:33

 4.日期之间的比较

 若 timeOne 大于 timeTwo ,返回 1;反之返回 -1,如果相等则返回 0

let timeOne = new Date("2022-09-20 16:09:33");
let timeTwo = new Date("2022-01-20 21:19:53");
let currentTime = compareAsc(timeOne, timeTwo);
console.log(currentTime); // 1

5.日期之间的差值

方法描述
differenceInYears
differenceInMonths
differenceInWeeks
differenceInDays
differenceInHours
differenceInMinutes

 例:相差多少年

let timeOne = new Date("2022");
let timeTwo = new Date("2015");
let currentTime = differenceInYears(timeOne, timeTwo);
console.log(currentTime); // 7

6.判断日期是否为今/昨/明天

 判断成立返回 true,反之返回 false

方法描述
isToday今天
isYesterday昨天
isTomorrow明天

 例:判断是否为今天

let dateTime = new Date("2022-09-20");
const currentTime = isToday(dateTime);
console.log(currentTime); // true

7.获取当天的开始/结束时间

方法描述
startOfDay开始时间
endOfDay结束时间

 例:获取今天开始时间

let dateTime = new Date("2022-09-20 16:09:33");
let currentTime = format(startOfDay(dateTime), "yyyy-MM-dd HH:mm:ss");
console.log(currentTime); // 2022-09-20 00:00:00

8. 获取当月月份的第一天/最后一天

方法描述
startOfMonth当月第一天
endOfMonth当月最后一天

 例:获取当月第一天

let dateTime = new Date("2022-09-20");
let currentTime = format(startOfMonth(dateTime), "yyyy-MM-dd");
console.log(currentTime); // 2022-09-01

9. 获取传入的日期是哪一年/月/周几/几号

方法描述
getYear哪一年
getMonth哪一个月 注意:因为是从0开始,所以最终的结果需要加1
getDay周几
getDate几号
getHours小时
getMinutes分钟

 例:获取传入的日期是哪一年

// 获取传入的日期是星期几
let dateTime = new Date("2022-12-20");
let currentTime = getYear(dateTime);
console.log(currentTime); // 2022

10.获取传入日期所在一年当中的第几周

let dateTime = new Date("2020-01-11");
let currentTime = getISOWeek(dateTime);
console.log(currentTime); // 2

11.判断传入的日期是否相等

 若返回 true,则是相等的,反之若为 false 则不相等

let timeOne = new Date("2020-12-31");
let timeTwo = new Date("2020-11-31");
let currentTime = isEqual(timeOne, timeTwo);
console.log(currentTime); // false

相关文章:

JavaScript日期库之date-fn.js

用官网的话来说,date-fn.js 就是一个现代 JavaScript 日期实用程序库,date-fns 为在浏览器和 Node.js 中操作 JavaScript 日期提供了最全面、但最简单和一致的工具集。那实际用起来像它说的那么神奇呢,下面就一起来看看吧。 安装 安装的话就…...

五一假期出游攻略【诗与远方】

原文在:PUSDN 可以导入作为模板引用。 五一旅行计划 假期倒计时 [该类型的内容暂不支持下载] 本次目标:五一旅行计划【画饼版】 前言 任何一个地方,一个城市,都有可观赏的地方,如果没去过邢台的,建议五一去…...

怎样正确做web应用的压力测试?

web应用,通俗来讲就是一个网站,主要依托于浏览器实现其功能。 提到压力测试,我们想到的是服务端压力测试,其实这是片面的,完整的压力测试包含服务端压力测试和前端压力测试。 下文将从以下几部分内容展开&#xff1a…...

Hibernate的持久化类

Hibernate是一个开源的ORM(对象关系映射)框架,用于将Java程序中的对象映射到数据库中的关系型数据。在Hibernate中,持久化类是用来映射Java对象和关系型数据库表的类。 编写Hibernate持久化类需要遵循以下规则: 持久…...

【c语言】enum枚举类型的定义格式 | 基本用法

创作不易&#xff0c;本篇文章如果帮助到了你&#xff0c;还请点赞支持一下♡>&#x16966;<)!! 主页专栏有更多知识&#xff0c;如有疑问欢迎大家指正讨论&#xff0c;共同进步&#xff01; 给大家跳段街舞感谢支持&#xff01;ጿ ኈ ቼ ዽ ጿ ኈ ቼ ዽ ጿ ኈ ቼ ዽ ጿ…...

Python数据挖掘与机器学习

近年来&#xff0c;Python编程语言受到越来越多科研人员的喜爱&#xff0c;在多个编程语言排行榜中持续夺冠。同时&#xff0c;伴随着深度学习的快速发展&#xff0c;人工智能技术在各个领域中的应用越来越广泛。机器学习是人工智能的基础&#xff0c;因此&#xff0c;掌握常用…...

Java有用的书籍2

. 1.《Effective Java》是由Joshua Bloch撰写的一本Java编程规范和最佳实践指南&#xff0c;第三版是最新版。它涵盖了Java编程中一些常见问题和技巧&#xff0c;以及如何编写更加优雅、健壮和高效的Java代码。 该书共分为15章&#xff0c;每一章都涵盖了Java编程中的一个关键…...

CTA进网测试《5G消息 终端测试方法》标准依据:YDT 3958-2021

GB 21288-2022 强制国标要求变化​ 与GB 21288-2007相比&#xff0c; 新国标主要有以下变化&#xff1a; 1. 增加职业暴露定义&#xff1a; 2. 增加吸收功率密度定义&#xff1a; 3. 增加不同频率、不同人体部位适用的暴露限值&#xff1a; 4. 增加产品说明书的注释&#xff1a…...

[LeetCode复盘] LCCUP‘23春季赛 20230422

[LeetCode复盘] LCCUP23春季赛 20230422 一、总结二、 1. 补给马车1. 题目描述2. 思路分析3. 代码实现 三、2. 探险营地1. 题目描述2. 思路分析3. 代码实现 四、 3. 最强祝福力场1. 题目描述2. 思路分析3. 代码实现 五、 4. 传送卷轴1. 题目描述2. 思路分析3. 代码实现 六、 5…...

传统燃油车的智控App远控响应速度优化方向几点思考

一、分析当前问题及其影响因素 网络延迟&#xff1a;燃油车的App远控响应速度受到网络延迟的影响。网络延迟可能是由于网络拥堵或服务器响应速度慢等原因导致的。 用户设备&#xff1a;用户设备的性能也会影响燃油车的App远控响应速度。例如&#xff0c;设备的内存不足或存在故…...

回炉重造九---DNS服务器

1、DNS服务器的相关概念和技术 1.1 DNS服务器的类型 主DNS服务器从DNS服务器缓存DNS服务器&#xff08;forward DNS服务器{转发器}&#xff09; 1.1.1 主DNS服务器的作用 管理和维护所负责解析的域内解析库的服务器1.1.2 从DNS服务器的作用 从主服务器或从服务器“复制”解…...

UE4/5多人游戏详解(七、自定义委托,实现寻找会话和加入会话的函数,通过Steam进行两台电脑的联机)

目录 可能出现问题&#xff08;在六部分的测试可能无法连接的问题【在末尾加上了&#xff0c;怕有人没看见在这里写一下】&#xff09; 自定义委托 调整位置 创建更多的委托和回调函数给菜单&#xff1a; 多播和动态多播 代码&#xff1a; 委托变量 代码&#xff1a; 回…...

【数据库多表操作】sql语句基础及进阶

常用数据库&#xff1a; 数据库&#xff08;Database&#xff09;是按照数据结构来组织、存储和管理数据的仓库&#xff0c;它是长期存储在计算机内、有组织、有结构的数据集合。数据库是信息系统的核心部分&#xff0c;现代软件系统中大量采用了数据库管理系统&#xff08;DBM…...

DPDK和RDMA的区别

网络的发展好像在各方面都是滞后于计算和存储&#xff0c;时延方面也不例外&#xff0c;网络传输时延高&#xff0c;逐渐成为了数据中心高性能的瓶颈。因为传统两个节点间传输数据的网络路径上有大量的内存拷贝&#xff0c;导致网络传输效率低下&#xff0c;网络数据包的收发处…...

体验 Google Bard

环境 windows 10 64bitGoogle Bardpython 3.8 简介 本篇介绍一个开源的 Google 聊天机器人Bard 的 API 逆向工程&#xff0c;使用它&#xff0c;可以免费的使用 Bard 服务&#xff0c;项目地址&#xff1a;https://github.com/acheong08/Bard 安装及使用 通过 pip 来安装 pip &…...

MITA触摸屏维修WP4053米塔工控机控制屏维修

MITA-TEKNIK米塔触摸屏维修工控机工控屏控制器维修DISPLAY 2COM全系列型号 Mita-Teknik触摸屏维修常见故障&#xff1a;上电无显示&#xff0c;运行报故障&#xff0c;无法与电脑通讯&#xff0c;触摸无反应&#xff0c;触控板破裂&#xff0c;触摸玻璃&#xff0c;上电黑屏&a…...

Nacos简介 安装 配置

简介 什么是注册中心 注册中心在微服务项目中扮演着非常重要的角色&#xff0c;是微服务架构中的纽带&#xff0c;类似于通讯录&#xff0c;它记录了服务和服务地址的映射关系。在分布式架构中&#xff0c;服务会注册到这里&#xff0c;当服务需要调用其它服务时&#xff0c;…...

五、MyBatis各种查询功能

MyBatis的各种查询功能 如果查询出的数据只有一条&#xff0c;可以通过 实体类对象接收List集合接收Map集合接收 如果查询出的数据有多条&#xff0c;一定不能用实体对象接收&#xff0c;会抛TooManyResultsException&#xff0c;可以通过 实体类类型的List集合接收Map类型…...

uni-app——picker组件的用法、时间、日期、地区选择器等

1、uniapp–picker组件 <template><view class"signUp"><view class"signUp_dv1"><u-form :model"form" ref"uForm" label-width"95px"><u-form-item label"日期" :required"tr…...

什么情况需要考虑 mysql 分表

最近看到公司的其中一个数据库用户表每个月都要几百万的新用户数据增加&#xff0c;目前单表已经是两千多万了。所以找了 DBA 讨论&#xff0c;发现以前学的知识&#xff0c;以及网上的一些资料其实说的并不是很正确&#xff0c;比如 mysql 单表不建议超过一千万&#xff0c;我…...

接口测试中缓存处理策略

在接口测试中&#xff0c;缓存处理策略是一个关键环节&#xff0c;直接影响测试结果的准确性和可靠性。合理的缓存处理策略能够确保测试环境的一致性&#xff0c;避免因缓存数据导致的测试偏差。以下是接口测试中常见的缓存处理策略及其详细说明&#xff1a; 一、缓存处理的核…...

[2025CVPR]DeepVideo-R1:基于难度感知回归GRPO的视频强化微调框架详解

突破视频大语言模型推理瓶颈,在多个视频基准上实现SOTA性能 一、核心问题与创新亮点 1.1 GRPO在视频任务中的两大挑战 ​安全措施依赖问题​ GRPO使用min和clip函数限制策略更新幅度,导致: 梯度抑制:当新旧策略差异过大时梯度消失收敛困难:策略无法充分优化# 传统GRPO的梯…...

JavaScript 中的 ES|QL:利用 Apache Arrow 工具

作者&#xff1a;来自 Elastic Jeffrey Rengifo 学习如何将 ES|QL 与 JavaScript 的 Apache Arrow 客户端工具一起使用。 想获得 Elastic 认证吗&#xff1f;了解下一期 Elasticsearch Engineer 培训的时间吧&#xff01; Elasticsearch 拥有众多新功能&#xff0c;助你为自己…...

电脑插入多块移动硬盘后经常出现卡顿和蓝屏

当电脑在插入多块移动硬盘后频繁出现卡顿和蓝屏问题时&#xff0c;可能涉及硬件资源冲突、驱动兼容性、供电不足或系统设置等多方面原因。以下是逐步排查和解决方案&#xff1a; 1. 检查电源供电问题 问题原因&#xff1a;多块移动硬盘同时运行可能导致USB接口供电不足&#x…...

论文浅尝 | 基于判别指令微调生成式大语言模型的知识图谱补全方法(ISWC2024)

笔记整理&#xff1a;刘治强&#xff0c;浙江大学硕士生&#xff0c;研究方向为知识图谱表示学习&#xff0c;大语言模型 论文链接&#xff1a;http://arxiv.org/abs/2407.16127 发表会议&#xff1a;ISWC 2024 1. 动机 传统的知识图谱补全&#xff08;KGC&#xff09;模型通过…...

DBAPI如何优雅的获取单条数据

API如何优雅的获取单条数据 案例一 对于查询类API&#xff0c;查询的是单条数据&#xff0c;比如根据主键ID查询用户信息&#xff0c;sql如下&#xff1a; select id, name, age from user where id #{id}API默认返回的数据格式是多条的&#xff0c;如下&#xff1a; {&qu…...

C++ 求圆面积的程序(Program to find area of a circle)

给定半径r&#xff0c;求圆的面积。圆的面积应精确到小数点后5位。 例子&#xff1a; 输入&#xff1a;r 5 输出&#xff1a;78.53982 解释&#xff1a;由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982&#xff0c;因为我们只保留小数点后 5 位数字。 输…...

C# SqlSugar:依赖注入与仓储模式实践

C# SqlSugar&#xff1a;依赖注入与仓储模式实践 在 C# 的应用开发中&#xff0c;数据库操作是必不可少的环节。为了让数据访问层更加简洁、高效且易于维护&#xff0c;许多开发者会选择成熟的 ORM&#xff08;对象关系映射&#xff09;框架&#xff0c;SqlSugar 就是其中备受…...

Element Plus 表单(el-form)中关于正整数输入的校验规则

目录 1 单个正整数输入1.1 模板1.2 校验规则 2 两个正整数输入&#xff08;联动&#xff09;2.1 模板2.2 校验规则2.3 CSS 1 单个正整数输入 1.1 模板 <el-formref"formRef":model"formData":rules"formRules"label-width"150px"…...

华为OD机考-机房布局

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseSystem.out.println(solve(in.nextLine()));}}priv…...