Day.js | JS 中处理日期的最轻量级 API

2025-05-26

Day.js | JS 中处理日期的最轻量级 API

今天我再次写信给您带来一个可以帮助我们处理 JavaScript 中日期的库，是的，众所周知，JavaScript 中日期的处理不是很直观。

🤔 为什么要使用 dayjs？

基本上，使用的理由dayjs是为了简化 JavaScript 中日期的处理。

它是一个相当广泛使用的库，您可能已经听说过它，它是在一段时间前作为替代品提出的Moment，但现在不建议使用，主要原因是它的重量，而出现提供更现代、更轻量级解决方案的新替代品dayjs就是一个例子。

片刻

点击此处查看更多

图像

Dayjs

点击此处查看更多

图像

它非常轻，因为它利用了Treeshaking库可以通过我们根据出现的需求添加的插件完全扩展的优势，这样我们只需要导入我们需要的东西。

🧪 一些例子

现在我们将看一些示例，与本机 API 相比，它的使用是合理的，无论是为了简单性、可读性还是为了防止可能的错误。

我们将回顾它为dayjs我们提供的一些最有趣的功能。

🧹无需插件

获取两个日期之间的天数差

文档

import dayjs from "dayjs";

dayjs(new Date(2020, 5, 10)).diff(new Date(2020, 5, 1), "day"); // output:  9
Enter fullscreen mode Exit fullscreen mode

检查给定的日期是否有效

文档

import dayjs from "dayjs";

dayjs("20").isValid(); // output:  false
dayjs("2021-09-13").isValid(); // output:  true
Enter fullscreen mode Exit fullscreen mode

获取当月天数

文档

import dayjs from "dayjs";

dayjs("2021-09-13").daysInMonth() // output: 30
Enter fullscreen mode Exit fullscreen mode

添加天、月、年、小时、分钟、秒等。

文档

import dayjs from "dayjs";

dayjs("2021-09-13 20:09:09").add(20, "minute").format() // output: 2021-09-13T20:29:09+02:00
Enter fullscreen mode Exit fullscreen mode

减去天、月、年、小时、分钟、秒等

文档

import dayjs from "dayjs";

dayjs("2021-09-13 20:09:09").subtract(20, "minute").format() // output: 2021-09-13T19:49:09+02:00
Enter fullscreen mode Exit fullscreen mode

⚡ 通过插件扩展功能

相对时间

文档

使用西班牙语言环境获取当前日期和给定日期之间的字符串格式的时间差

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

dayjs.locale("es");
dayjs.extend(relativeTime);

dayjs("2021-09-14T13:28:55.979Z").fromNow(); // example output: en 3 horas
Enter fullscreen mode Exit fullscreen mode

一年中的第几周

文档

获取一年中的第几周

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

dayjs.extend(weekOfYear);

dayjs("2021-09-13T13:28:55.979Z").week(); // output: 38
Enter fullscreen mode Exit fullscreen mode

相同或之后

文档

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

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

dayjs.extend(isSameOrAfter);

// To use `year` granularity pass the second parameter
dayjs("2021-09-13").isSameOrAfter("2021-09-14", "year"); // output: true
Enter fullscreen mode Exit fullscreen mode

最小最大

文档

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

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() // output: 2021-09-20T00:00:00+02:00  
minDate.format() // output: 2021-09-13T00:00:00+02:00
Enter fullscreen mode Exit fullscreen mode

介于两者之间

文档

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

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

dayjs.extend(isBetween);

// To use `day` granularity pass the third parameter
dayjs("2010-10-21").isBetween(dayjs("2010-10-20"), dayjs("2010-10-25"), "day"); //output: true

// To use `year` granularity pass the third parameter
dayjs("2010-10-21").isBetween(dayjs("2010-10-20"), dayjs("2010-10-25"), "year"); //output: false
Enter fullscreen mode Exit fullscreen mode

高级格式

文档

Vitamin 默认格式选项

import dayjs from "dayjs";
import advancedFormat from "dayjs/plugin/advancedFormat";

dayjs.extend(advancedFormat);

dayjs("2021-09-14").format("Q Do k kk X x"); // output: 3 14th 24 24 1631570400 1631570400000
Enter fullscreen mode Exit fullscreen mode

从上面的示例中可以看出，该 API 非常简单且易读，如果我们需要在 JavaScript 中使用日期解决其他一些复杂的函数，那么毫无疑问这是一个很好的选择。

要查看更多信息，请访问官方dayjs 文档。

谢谢你读我的文章。😊

谢谢

文章来源：https://dev.to/producthackers/day-js-the-lightest-api-to-handle-dates-in-js-3n9j
Devto 翻译
PREV
使用 React 的交叉口观察器
NEXT
编写 Dockerfile：从初学者到高级