欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

基于Day.js更優(yōu)雅的處理JavaScript中的日期

 更新時間:2021年09月21日 09:59:40   作者:傲夫靠斯  
Day.js它能夠幫助我們處理JavaScript中的日期,本文就詳細(xì)的介紹一下Day.js的具體使用,可以更簡單的處理JavaScript中的日期和時間

今天我推薦給大家一個庫 Day.js,它能夠幫助我們處理JavaScript中的日期,因?yàn)镴avaScript中的日期實(shí)在是太難用了。在做業(yè)務(wù)開發(fā)時完全無法使用,需要自己去封裝各種函數(shù)。

為什么使用day.js

首先,使用day.js能夠幫助我們更簡單的處理JavaScript中的日期和時間。
在JavaScript中處理時間的庫你可能聽說很多,比如Moment,但都2021年了,其實(shí)是非常不推薦使用moment.js的,因?yàn)樽鳛槿掌谔幚砉ぞ撸^于的笨重,day.js是更現(xiàn)代并且更輕量化,更加容易擴(kuò)展的一個庫。

Moment.js

點(diǎn)擊這里查看體積大小

Day.js

點(diǎn)擊這里查看體積大小

它非常輕量化,因?yàn)樗梢岳肨reeShaking,并且通過插件的方式來進(jìn)行擴(kuò)展,我們可以根據(jù)自己的需求去引入插件,所以我們最后只會引入我們需要的東西。

沒有day.js我們怎么辦

在原生的JavaScript中,我們要獲取當(dāng)前的日期要這樣

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中我們只需這樣,當(dāng)然不止這樣,還支持很多功能。
import dayjs from "dayjs";

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

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

Day.js 例子

現(xiàn)在我們來看一些實(shí)用、有趣的例子,與原生API相比,它更加簡單,而且可讀性更強(qiáng)。

1. 獲取兩個日期相差的天數(shù)

查看文檔

import dayjs from "dayjs";

// 第二個參數(shù)指定為'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. 獲取輸入日期月份的天數(shù)

查看文檔

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

使用插件來擴(kuò)展功能

1. RelativeTime

查看文檔

獲取指定時間到現(xiàn)在的時間差。

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

查看文檔

獲取指定日期是當(dāng)年的第幾周

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

查看文檔

獲取數(shù)組中最大的日期,或者最小的日期

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

查看文檔

檢查指定日期是否在指定的日期范圍內(nèi)

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

dayjs.extend(isBetween);

// 使用日為顆粒度進(jìn)行比較
dayjs("2010-10-21").isBetween(dayjs("2010-10-20"), dayjs("2010-10-25"), "day");
// 輸出: true

// 使用年為顆粒度進(jìn)行比較
dayjs("2010-10-21").isBetween(dayjs("2010-10-20"), dayjs("2010-10-25"), "year");
// 輸出: false

 到此這篇關(guān)于基于Day.js更優(yōu)雅的處理JavaScript中的日期的文章就介紹到這了,更多相關(guān)Day.js處理日期內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論