Day.js常用方法集合(附各種事件格式的轉(zhuǎn)換)
標(biāo)題有部分重復(fù)，請見諒
優(yōu)點：
簡單易用：Day.js的語法簡單，易于理解和上手。它提供了豐富的日期操作方法和格式化選項，使得處理日期和時間變得容易和靈活。
體積?。篋ay.js的體積非常小，壓縮后只有2 KB左右。這使得它成為一個非常輕量級的日期庫，可以幫助優(yōu)化網(wǎng)頁加載速度，特別是在移動設(shè)備上。
無依賴：Day.js是一個獨立的日期庫，不依賴任何其他的第三方庫。這使得它在項目中使用起來非常方便，不需要處理其他庫的版本沖突和兼容性問題。
時區(qū)支持：Day.js支持時區(qū)操作，可以輕松處理不同時區(qū)的日期和時間。這對于國際化的應(yīng)用程序非常有用，并且可以避免時區(qū)轉(zhuǎn)換的復(fù)雜性。
插件生態(tài)系統(tǒng)：Day.js有一個豐富的插件生態(tài)系統(tǒng)，可以擴(kuò)展其功能和特性。這些插件可以滿足不同項目的需求，包括日期范圍選擇、日歷顯示等。
缺點：
功能相對有限：相比于一些其他日期庫，Day.js的功能相對有限。它不支持一些復(fù)雜的日期操作，如日期運算、日期比較、日期范圍計算等。如果需要處理復(fù)雜的日期邏輯，可能需要額外的編碼工作。
社區(qū)支持相對較少：相比于其他大型日期庫，Day.js的社區(qū)支持相對較少。這意味著在遇到問題或需要幫助時，可能無法得到及時和全面的解決方案。
時間格式化選項相對有限：盡管Day.js提供了一些常用的時間格式化選項，但相對于其他日期庫，它的時間格式化選項相對有限。這可能對一些特定的格式化需求造成限制。
接下來我們將詳細(xì)介紹 Day.js 的使用方法，并附上代碼示例和各種事件格式的轉(zhuǎn)換。
安裝與基本用法
可以通過 npm 或者 yarn 來安裝 Day.js：
# 使用 npm $ npm install dayjs # 使用 yarn $ yarn add dayjs
然后，在你的代碼中導(dǎo)入 Day.js：
import dayjs from 'dayjs';
或者：
const dayjs = require('dayjs');使用 dayjs() 函數(shù)創(chuàng)建一個 Day.js 實例，然后就可以通過該實例來對日期進(jìn)行各種操作。
const now = dayjs(); // 創(chuàng)建一個 Day.js 實例，表示當(dāng)前時間
console.log(now.format('YYYY-MM-DD')); // 輸出當(dāng)前日期，格式為"YYYY-MM-DD"Day.js 提供了很多方便的 API 來操作日期，比如加減天數(shù)、小時、分鐘等等。
console.log(now.add(1, 'day').format('YYYY-MM-DD')); // 加一天
console.log(now.subtract(1, 'week').format('YYYY-MM-DD')); // 減一周
console.log(now.startOf('month').format('YYYY-MM-DD')); // 月初日期
console.log(now.endOf('month').format('YYYY-MM-DD')); // 月末日期Day.js 還支持同時對多個日期進(jìn)行操作，比如計算兩個日期之間的天數(shù)差：
const start = dayjs('2022-01-01');
const end = dayjs('2022-01-10');
console.log(end.diff(start, 'day')); // 輸出10，表示兩個日期之間的天數(shù)差解析日期：
const date = dayjs('2022-01-01');格式化日期：
const formattedDate = date.format('YYYY-MM-DD');獲取當(dāng)前日期：
const currentDate = dayjs();
增加日期：
const newDate = date.add(1, 'day');
減少日期：
const newDate = date.subtract(1, 'day');
比較日期：
const isAfter = date1.isAfter(date2); const isBefore = date1.isBefore(date2); const isSame = date1.isSame(date2);
獲取日期之間的差異：
const diff = date1.diff(date2, 'day');
獲取日期的某個部分：
const year = date.year(); const month = date.month(); const day = date.date(); const hour = date.hour(); const minute = date.minute(); const second = date.second();
設(shè)置日期的某個部分：
const newDate = date.year(2023).month(1).date(1);
本地化顯示日期：
import localizedFormat from 'dayjs/plugin/localizedFormat';
import 'dayjs/locale/zh-cn';
dayjs.extend(localizedFormat);
dayjs.locale('zh-cn');
const formattedDate = date.format('LL');格式化日期
Day.js 提供了 format() 方法來格式化日期。它使用類似于 Moment.js 的字符串模板來定義日期的輸出格式。
以下是一些常用的模板字符串：
- - YYYY：4 位數(shù)的年份，如 2022
- - MMMM：月份的全名，如 January
- - MMM：月份的縮寫，如 Jan
- - DD：2 位數(shù)的日期，如 01
- - dddd：星期的全名，如 Sunday
- - ddd：星期的縮寫，如 Sun
- - HH：24 小時制的小時數(shù)，如 08
- - hh：12 小時制的小時數(shù)，如 08
- - mm：分鐘數(shù)，如 01
- - ss：秒數(shù)，如 01
console.log(now.format('YYYY-MM-DD')); // 輸出當(dāng)前日期，格式為"YYYY-MM-DD"
console.log(now.format('YYYY-MM-DD HH:mm:ss')); // 輸出當(dāng)前日期和時間，格式為"YYYY-MM-DD HH:mm:ss"
console.log(now.format('YYYY年M月D日 dddd')); // 輸出當(dāng)前日期，格式為"YYYY年M月D日 dddd"
// 格式化為相對時間（如：幾秒前、幾分鐘前）
dayjs.duration(60, 'seconds').humanize(); // "a minute"
// 格式化為時:分:秒
dayjs.duration(3661, 'seconds').format('H:mm:ss'); // "1:01:01"
// 格式化為天
dayjs.duration(2, 'days').asDays(); // 2Day.js 還支持自定義格式化函數(shù)，你可以傳入一個回調(diào)函數(shù)來定義自己的日期格式。
const customFormat = dayjs('2022-01-01').format(function () {
return 'Happy New Year!';
});
console.log(customFormat); // 輸出"Happy New Year!"
// 轉(zhuǎn)換為 Unix 時間戳
dayjs().unix();
// 轉(zhuǎn)換為 JavaScript Date 對象
dayjs().toDate();
// 轉(zhuǎn)換為 ISO 8601 格式的字符串
dayjs().toISOString();日期解析
Day.js 支持解析各種常見的日期格式，包括 ISO 8601 格式和各種本地格式。
const date = dayjs('2022-01-01');
console.log(date.format('YYYY-MM-DD')); // 輸出"2022-01-01"
// 轉(zhuǎn)換為 Unix 時間戳
dayjs().unix();
// 轉(zhuǎn)換為 JavaScript Date 對象
dayjs().toDate();
// 轉(zhuǎn)換為 ISO 8601 格式的字符串
dayjs().toISOString();Day.js 還支持解析 Unix 時間戳。
const unixTimestamp = 1640995200; // Unix 時間戳
const date = dayjs.unix(unixTimestamp);
console.log(date.format('YYYY-MM-DD')); // 輸出"2022-01-01"國際化支持
Day.js 內(nèi)置了 66 種語言的國際化支持，你可以方便地在你的應(yīng)用中切換不同的語言。下面是一些常用的國際化示例：
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn'; // 導(dǎo)入中文語言包
// 設(shè)置語言為中文
dayjs.locale('zh-cn');
// 格式化日期
dayjs().format('dddd'); // "星期六"日期比較
Day.js 提供了一些方法來比較日期的大小。
const date1 = dayjs('2022-01-01');
const date2 = dayjs('2022-01-02');
console.log(date1.isBefore(date2)); // 輸出 true，表示 date1 在 date2 之前
console.log(date1.isAfter(date2)); // 輸出 false，表示 date1 在 date2 之后
console.log(date1.isSame(date2, 'day')); // 輸出 false，表示 date1 和 date2 不是同一天日期格式化
Day.js 提供了一些方法來格式化日期。你可以將日期格式化為本地格式、UTC 格式、ISO 8601 格式等等。
將日期格式化為本地格式：
const date = dayjs('2022-01-01');
console.log(date.format('LL')); // 輸出 January 1, 2022將日期格式化為 UTC 格式：
const date = dayjs('2022-01-01');
console.log(date.utc().format('YYYY-MM-DD HH:mm:ss')); // 輸出 2022-01-01 00:00:00將日期格式化為 ISO 8601 格式：
const date = dayjs('2022-01-01');
console.log(date.toISOString()); // 輸出 2022-01-01T00:00:00.000Z時間格式的轉(zhuǎn)換
Day.js 提供了一些方法來轉(zhuǎn)換不同的事件格式，比如將日期轉(zhuǎn)換為 Unix 時間戳、將日期轉(zhuǎn)換為 JavaScript Date 對象等等。
將日期轉(zhuǎn)換為 Unix 時間戳：
const date = dayjs('2022-01-01');
console.log(date.unix()); // 輸出 1640995200將日期轉(zhuǎn)換為 JavaScript Date 對象：
const date = dayjs('2022-01-01');
console.log(date.toDate()); // 輸出 Sat Jan 01 2022 00:00:00 GMT+0800 (China Standard Time)將日期轉(zhuǎn)換為 Moment.js 對象：
const date = dayjs('2022-01-01');
console.log(date.toDate()); // 輸出 Moment<2022-01-01T00:00:00+08:00>事件操作
Day.js 提供了一些方法來操作日期，比如加減天數(shù)、小時、分鐘等等。
加減天數(shù)：
const date = dayjs('2022-01-01');
console.log(date.add(1, 'day').format('YYYY-MM-DD')); // 輸出 2022-01-02
console.log(date.subtract(1, 'day').format('YYYY-MM-DD')); // 輸出 2021-12-31比較兩個日期的差異：
const date1 = dayjs('2022-01-01');
const date2 = dayjs('2022-01-10');
console.log(date）總結(jié)：
Day.js 是一個輕量級，易于使用的 JavaScript 日期庫，提供了強大的日期和時間處理功能。它具有簡潔的 API，支持鏈?zhǔn)讲僮骱筒豢勺冃?。Day.js 支持國際化顯示和各種格式的日期和時間的解析和格式化。它還提供了豐富的插件系統(tǒng)，可以輕松擴(kuò)展功能。無論是在 Web 還是 Node.js 環(huán)境下，Day.js 都是一個不錯的選擇。
到此這篇關(guān)于Day.js常用方法集合的文章就介紹到這了,更多相關(guān)Day.js常用方法集合內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
本文主要講解的是V8的技術(shù)，是V8的入門篇，主要目的是了解V8的內(nèi)部機制，希望對前端，快應(yīng)用，瀏覽器，以及nodejs同學(xué)有些幫助。這里不涉及到如何編寫優(yōu)秀的前端，只是對JS內(nèi)部引擎技術(shù)的講解2021-06-06
上傳是個老生常談的話題了,多數(shù)情況下各位想必用的是uplodify,webUploader之類的插件,這篇文章主要給大家介紹了關(guān)于JavaScript圖片上傳并預(yù)覽的相關(guān)資料,需要的朋友可以參考下2022-01-01
下面小編就為大家?guī)硪黄狫S 仿支付寶input文本輸入框放大組件的實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-11-11
前臺頁面五分鐘，自己刷新一次，所以最多只有五分鐘的差錯。2008-10-10
這篇文章主要為大家詳細(xì)介紹如何完美實現(xiàn)js選項卡切換效果，通過設(shè)置定時器實現(xiàn)延時0.5s切換選項卡，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-03-03
基于 D3.js 繪制動態(tài)進(jìn)度條的實例詳解
D3是一個被數(shù)據(jù)驅(qū)動的文檔。這篇文章主要介紹了基于 D3.js 繪制動態(tài)進(jìn)度條的方法,需要的朋友可以參考下2018-02-02
這篇文章主要介紹了js控制div彈出層實現(xiàn)方法,可實現(xiàn)點擊鏈接彈出div浮動層,且背景色變暗的效果,是一款非常實用的特效源碼,需要的朋友可以參考下2015-05-05
帶領(lǐng)大家學(xué)習(xí)javascript基礎(chǔ)篇(一)之基本概念
這篇文章主要介紹了帶領(lǐng)大家學(xué)習(xí)javascript基礎(chǔ)篇(一)之基本概念的相關(guān)資料,需要的朋友可以參考下2015-11-11
本文為大家介紹下使用js仿新浪微博登陸郵箱提示效果，具體實現(xiàn)代碼如下，感興趣的朋友可以參考下，希望對大家有所幫組2013-08-08
Bootstrap3 多個模態(tài)對話框無法顯示的解決方案
這篇文章主要介紹了Bootstrap3 多個模態(tài)對話框無法顯示的解決方案,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-02-02