iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >基于Day.js更优雅的处理JavaScript中的日期
  • 322
分享到

基于Day.js更优雅的处理JavaScript中的日期

2024-04-02 19:04:59 322人浏览 泡泡鱼
摘要

目录为什么使用day.jsMoment.jsDay.js没有day.js我们怎么办Day.js 例子1. 获取两个日期相差的天数2. 检查日期是否合法3. 获取输入日期月份的天数4.

今天我推荐给大家一个库 Day.js,它能够帮助我们处理javascript中的日期,因为JavaScript中的日期实在是太难用了。在做业务开发时完全无法使用,需要自己去封装各种函数。

为什么使用day.js

首先,使用day.js能够帮助我们更简单的处理JavaScript中的日期和时间。
在JavaScript中处理时间的库你可能听说很多,比如Moment,但都2021年了,其实是非常不推荐使用moment.js的,因为作为日期处理工具,它过于的笨重,day.js是更现代并且更轻量化,更加容易扩展的一个库。

Moment.js

点击这里查看体积大小

Day.js

点击这里查看体积大小

它非常轻量化,因为它可以利用TreeShaking,并且通过插件的方式来进行扩展,我们可以根据自己的需求去引入插件,所以我们最后只会引入我们需要的东西。

没有day.js我们怎么办

在原生的JavaScript中,我们要获取当前的日期要这样


const today = new Date();
const dd = String(today.getDate()).padStart(2, '0'); // 日
const mm = String(today.getMonth() + 1).padStart(2, '0'); // 月
const yyyy = today.getFullYear(); // 年
const curDate = `${yyyy}-${mm}-${dd}`

console.log(curDate)
// 输出: 2021-09-17

在day.js中我们只需这样,当然不止这样,还支持很多功能。
import dayjs from "dayjs";

const curDate = dayjs().fORMat('YYYY-MM-DD');

console.log(curDate)
// 输出: 2021-09-17

Day.js 例子

现在我们来看一些实用、有趣的例子,与原生api相比,它更加简单,而且可读性更强。

1. 获取两个日期相差的天数

查看文档


import dayjs from "dayjs";

// 第二个参数指定为'day'代表以日为颗粒度
dayjs(new Date(2021, 10, 1)).diff(new Date(2021, 9, 17), "day"); 
// 输出: 15

2. 检查日期是否合法

查看文档


import dayjs from "dayjs";

dayjs("20").isValid(); 
// 输出:  false
dayjs("2021-09-17").isValid(); 
// 输出:  true

3. 获取输入日期月份的天数

查看文档


import dayjs from "dayjs";

dayjs("2021-09-13").daysInMonth() 
// 输出: 30

4. 添加日、月、年、时、分、秒

查看文档


import dayjs from "dayjs";

dayjs("2021-09-17 08:10:00").add(20, "minute").format('YYYY-MM-DD HH:mm:ss') 
// 输出: 2021-09-17 08:30:00

5. 减去日、月、年、时、分、秒

查看文档


import dayjs from "dayjs";

dayjs("2021-09-17 08:10:00").subtract(20, "minute").format('YYYY-MM-DD HH:mm:ss')
// 输出: 2021-09-17 07:50:00

使用插件来扩展功能

1. RelativeTime

查看文档

获取指定时间到现在的时间差。


import dayjs from "dayjs";
import relativeTime from "dayjs/plugin/relativeTime";

dayjs.extend(relativeTime);

dayjs("2021-09-16 13:28:55").fromNow();
// 输出: 9 hours aGo

下面是所有的输出表

Range Key Sample Output
0 to 44 秒 s a few seconds ago
45 to 89 秒 m a minute ago
90 秒 to 44 分钟 mm 2 minutes ago ... 44 minutes ago
45 to 89 分钟 h an hour ago
90 分钟 to 21 小时 hh 2 hours ago ... 21 hours ago
22 to 35 小时 d a day ago
36 小时 to 25 天 dd 2 days ago ... 25 days ago
26 to 45 天 M a month ago
46 天 to 10 月 MM 2 months ago ... 10 months ago
11 月 to 17月 y a year ago
18 月+ yy 2 years ago ... 20 years ago

2. WeekOfYear

查看文档

获取指定日期是当年的第几周


import dayjs from "dayjs";
import weekOfYear from "dayjs/plugin/weekOfYear";

dayjs.extend(weekOfYear);

dayjs("2021-09-13 14:00:00").week(); 
// 输出: 38

3. IsSameOrAfter

查看文档

检查一个日期是否等于或者大于一个日期


import dayjs from "dayjs";
import isSameOrAfter from "dayjs/plugin/isSameOrAfter";

dayjs.extend(isSameOrAfter);

dayjs("2021-09-17").isSameOrAfter("2021-09-16"); 
// 输出: true

4. MinMax

查看文档

获取数组中最大的日期,或者最小的日期


import dayjs from "dayjs";
import minMax from "dayjs/plugin/minMax";

dayjs.extend(minMax)

const maxDate = dayjs.max([
    dayjs("2021-09-13"), 
    dayjs("2021-09-16"), 
    dayjs("2021-09-20")
])

const minDate = dayjs.min([
    dayjs("2021-09-13"), 
    dayjs("2021-09-16"), 
    dayjs("2021-09-20")
])

maxDate.format('YYYY-MM-DD HH:mm:ss') 
// 输出: 2021-09-20 00:00:00
minDate.format('YYYY-MM-DD HH:mm:ss') 
// 输出: 2021-09-13 00:00:00

5. IsBetween

查看文档

检查指定日期是否在指定的日期范围内


import dayjs from "dayjs";
import isBetween from "dayjs/plugin/isBetween";

dayjs.extend(isBetween);

// 使用日为颗粒度进行比较
dayjs("2010-10-21").isBetween(dayjs("2010-10-20"), dayjs("2010-10-25"), "day");
// 输出: true

// 使用年为颗粒度进行比较
dayjs("2010-10-21").isBetween(dayjs("2010-10-20"), dayjs("2010-10-25"), "year");
// 输出: false

 到此这篇关于基于Day.js更优雅的处理JavaScript中的日期的文章就介绍到这了,更多相关Day.js处理日期内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: 基于Day.js更优雅的处理JavaScript中的日期

本文链接: https://www.lsjlt.com/news/136262.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 基于Day.js更优雅的处理JavaScript中的日期
    目录为什么使用day.jsMoment.jsDay.js没有day.js我们怎么办Day.js 例子1. 获取两个日期相差的天数2. 检查日期是否合法3. 获取输入日期月份的天数4....
    99+
    2024-04-02
  • JavaScript中async await更优雅的错误处理方式
    目录背景 为什么要错误处理 async await 更优雅的错误处理 小结 总结背景 团队来了新的小伙伴,发现我们的团队代码规范中,要给 async  await 添加 ...
    99+
    2024-04-02
  • JavaScript如何优雅的处理async/await
    这篇文章给大家分享的是有关JavaScript如何优雅的处理async/await的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。优雅的处理 async/await使用方法:无需每次使用 async/await 都...
    99+
    2023-06-27
  • Java:如何更优雅的处理空值?
    在笔者几年的开发经验中,经常看到项目中存在到处空值判断的情况,这些判断,会让人觉得摸不着头绪,它的出现很有可能和当前的业务逻辑并没有关系。但它会让你很头疼。有时候,更可怕的是系统因为这些空值的情况,会抛出空指针异常,导致业务系统发生问题。此...
    99+
    2023-06-03
  • JavaScript优雅处理对象的6种方法
    目录前言1、Object.freeze()2、Object.seal()3、Object.keys()4、Object.values()5、Object.create()6、Obje...
    99+
    2024-04-02
  • Python中更优雅的日志记录方案详解
    目录常见使用loguru安装基本使用详细使用在 Python 中,一般情况下我们可能直接用自带的 logging 模块来记录日志,包括我之前的时候也是一样。在使用时我们需要配置一些 ...
    99+
    2024-04-02
  • Scala中优雅的处理Null问题
    目录前言什么是Option煮个栗子Option的好处不仅如此简单的总结java null 与 scala OptionOption的缺点Either Left Right简介与使用前...
    99+
    2024-04-02
  • 关于Android输入法弹窗bug的优雅处理
    目录前言别人家的产品处理实现掘金的输入框弹窗实现weChat聊天背景不会被压缩的问题解决方法方法一方法二方法三总结前言 最近发现一个bug,在项目中的某个界面,每当弹出输入法时,背景...
    99+
    2024-04-02
  • PHP8.0中的日期处理库:Carbon
    PHP语言一直以来都是Web开发领域中最受欢迎的语言之一。由于其易学易用,强大的功能和广泛的支持,PHP开发已经成为网站开发和实现Web应用程序的首选。在Web应用程序开发过程中,日期和时间处理通常是必须考虑的一项基本任务。决定如何处理日期...
    99+
    2023-05-14
    PHP carbon 日期处理
  • throw 语句的艺术:优雅地处理 JavaScript 错误
    在 JavaScript 中,throw 语句是处理错误和异常的强大工具。它允许您创建自定义错误对象,并将其抛出以供后续代码处理。使用 throw 语句可以实现更清晰、更结构化的错误处理,从而提高应用程序的健壮性和可维护性。 throw...
    99+
    2024-03-01
    JavaScript、错误处理、throw 语句
  • Springboot项目优雅地处理日志的方法详解
    如上图,每天会生成一个新的日志文件,然后日志进行分类,我这里只对error和info进行分类。 怎么做呢? 首先,在resource目录创建一个新文件,取名logback-spr...
    99+
    2024-04-02
  • ASP Core 中的异常处理:优雅地处理错误
    异常处理是在 ASP Core 中构建健壮应用程序的关键方面。本文将指导您了解 ASP Core 中异常处理的原则,并提供演示代码来展示如何优雅地处理错误,以增强用户体验和应用程序稳定性。 引言 在 ASP Core 应用程序中,处理未...
    99+
    2024-03-07
    ASP Core、异常处理、错误处理、中间件
  • 使用 Python 异常处理,让你的代码更加优雅
    在 Python 中,异常处理机制是程序开发中非常重要的一部分。它可以帮助你捕获并处理运行时错误,从而防止程序崩溃。同时,异常处理机制也可以让你编写出更加健壮和可靠的代码。 在 Python 中,异常处理主要通过 try-except-...
    99+
    2024-02-25
    Python 异常处理 错误处理 try-except finally
  • PHP 异常处理的进阶技巧:让你的代码更优雅!
    异常捕获: try-catch-finally:这是最基本也是最常用的异常捕获方式,try 块包含可能引发异常的代码,catch 块包含处理异常的代码,finally 块则无论是否发生异常都会执行的代码。 set_exceptio...
    99+
    2024-02-24
    PHP 异常处理 异常捕获 异常抛出 异常自定义 异常日志记录
  • PHP 错误处理高级技巧:让你的代码更优雅
    自定义错误处理函数 PHP默认的错误处理方式是显示一条错误消息并终止脚本。但是,你可以自定义自己的错误处理函数,以便对错误进行更细粒度的控制。自定义错误处理函数的语法如下: function my_error_handler($er...
    99+
    2024-02-06
    PHP 错误处理 自定义错误处理函数 错误日志记录 异常处理 错误类型提示
  • NumPy日志中的PHP和JavaScript:如何优化数据处理?
    在现代数据分析和机器学习领域中,NumPy是最常用的Python库之一。它提供了一种高效的多维数组操作方式,使得数据处理变得更加简单和快速。但是,由于数据处理通常涉及大量的计算和操作,因此优化NumPy代码的效率变得尤为重要。 在本文中,...
    99+
    2023-06-29
    numy 日志 javascript
  • 如何处理PHP中的日期和时间?
    在Web开发中,日期和时间是非常重要的因素,尤其是针对交互和数据存储。在PHP中,处理日期和时间的功能非常强大,比如获取当前时间、将时间戳转换成日期时间格式、比较两个日期时间等等。在本篇文章中,将介绍如何处理PHP中的日期和时间。获取当前时...
    99+
    2023-05-20
    PHP日期和时间 时间格式化 时区处理
  • MySQL中日期为零值的处理方法
    这篇文章主要讲解了“MySQL中日期为零值的处理方法”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“MySQL中日期为零值的处理方法”吧!前言:前面文章我们介...
    99+
    2024-04-02
  • 在 MySQL 中处理 1970 年之前的日期?
    您需要使用日期类型来处理 1970 年之前的日期,因为日期存储的值是从 1000 到 9999。当您仅需要处理日期部分而不是出于时间目的时,可以使用日期类型。MySQL 给出以下格式的数据。格式如下 -‘YYYY-MM-DD&r...
    99+
    2023-10-22
  • Go应用中优雅处理Error的技巧总结
    目录前言用户自定义类型上下文数据原因(Causes)组件(Component)响应类型(ResponseType)重试GoError 接口抽象error结论前言 Go语言很强大并且现...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作