date-fns详解

CLLC • 2024-11-05 16:54 • 编程

一、date-fns与其他日期库对比

目前常见的日期库有moment、 dayjs等，它们与date-fns最大的不同在于体积。

date-fns的体积相比moment和dayjs来说更小，同样的功能却能够获得更快的加载速度，这对于一些需要追求网页加载速度的场景来说非常实用。

// date-fns

import { format, addDays } from 'date-fns';

const today = new Date();
console.log(format(today, 'YYYY-MM-DD'));
console.log(addDays(today, 1));

// dayjs

import dayjs from 'dayjs';

const today = dayjs();
console.log(today.format('YYYY-MM-DD'));
console.log(today.add(1, 'day'));

// moment

import moment from 'moment';

const today = moment();
console.log(today.format('YYYY-MM-DD'));
console.log(today.add(1, 'day'));

二、date-fns isBefore函数的使用

isBefore函数是判断两个日期的先后顺序，如果第一个日期早于第二个日期则返回true，否则返回false。

isBefore函数对于计算倒计时、显示时间差等场景来说非常实用。

import { isBefore } from 'date-fns';

const date1 = new Date('2022-01-01');
const date2 = new Date('2022-01-02');

console.log(isBefore(date1, date2)); // true
console.log(isBefore(date2, date1)); // false

三、date-fns 日期格式化函数

日期格式化函数是将日期转换为指定格式的字符串，date-fns中的format函数支持大量的日期格式化格式。

比如，我们需要将日期转化为’YYYY-MM-DD’的格式：

import { format } from 'date-fns';

const date = new Date('2022-01-01');

console.log(format(date, 'YYYY-MM-DD')); // 2022-01-01

如果我们需要将日期转化为’MMMM Do YYYY, h:mm:ss a’的格式：

import { format } from 'date-fns';

const date = new Date('2022-01-01 12:34:56');

console.log(format(date, 'MMMM Do YYYY, h:mm:ss a')); // January 1st 2022, 12:34:56 pm

四、date-fns 获取日期差值函数

有时候我们需要计算两个日期之间的差值，date-fns提供了diff函数来完成这个任务。

比如，我们需要计算两个日期相差的天数：

import { differenceInDays } from 'date-fns';

const date1 = new Date('2022-01-01');
const date2 = new Date('2022-01-05');

console.log(differenceInDays(date2, date1)); // 4

还可以计算出相差的小时，分钟等等。

五、date-fns 获取开始结束时间函数

有时候我们需要根据当前日期计算出开始和结束时间，date-fns提供了startOf和endOf两个函数来完成这个任务。

import { startOfDay, endOfDay } from 'date-fns';

const date = new Date('2022-01-01 12:34:56');

console.log(startOfDay(date)); // 2022-01-01T00:00:00.000Z
console.log(endOfDay(date)); // 2022-01-01T23:59:59.999Z

这些函数会将日期设置为对应的起始时间和结束时间，我们可以用它们来计算一天、一周、一月的开始和结束时间等。

原创文章，作者：CLLC，如若转载，请注明出处：https://www.506064.com/n/149806.html