JavaScript日期處理庫Day.js使用文檔
更新時間：2025年12月15日 08:20:33 作者：懶羊羊我小弟
Day.js是一個輕量的處理時間和日期的JavaScript庫,和Moment.js的API設計保持完全一樣,這篇文章主要介紹了JavaScript日期處理庫Day.js使用文檔的相關資料,需要的朋友可以參考下
一、什么是 Day.js？
Day.js 是一個輕量級的 JavaScript 日期處理庫，API 設計與 Moment.js 高度一致，但體積僅 2KB 左右（遠小于 Moment.js 的 24KB+），且支持 tree-shaking，非常適合對體積敏感的項目。它專注于日期解析、格式化、計算等核心功能，同時保持了簡潔的 API 和良好的兼容性。
二、安裝與引入
1. 安裝
通過 npm 或 yarn 安裝：
npm install dayjs --save # 或 yarn add dayjs
2. 引入
在項目中直接引入即可使用核心功能：
import dayjs from 'dayjs'
三、核心概念：Day.js 對象
Day.js 的所有操作都圍繞「Day.js 對象」進行。該對象是不可變的（immutable），即任何修改操作（如加減時間、設置日期）都會返回一個新的 Day.js 對象，原對象不會被改變。
創(chuàng)建 Day.js 對象的常用方式：
// 1. 當前時間
const now = dayjs()
// 2. 從字符串創(chuàng)建（支持 ISO 格式、YYYY-MM-DD 等）
const date1 = dayjs('2023-10-01')
const date2 = dayjs('2023-10-01T12:30:00')
// 3. 從時間戳創(chuàng)建（毫秒）
const date3 = dayjs(1696108800000) // 對應 2023-10-01 00:00:00
// 4. 從 Date 對象創(chuàng)建
const date4 = dayjs(new Date(2023, 9, 1)) // 注意：Month 是 0 基（9 對應 10月）
// 5. 復制現有 Day.js 對象
const date5 = dayjs(now) // 復制 now 對象
四、常用 API 操作
1. 格式化日期（format）
將 Day.js 對象轉為指定格式的字符串，支持多種占位符：
const date = dayjs('2023-10-01 12:30:45')
// 常用格式
date.format('YYYY-MM-DD') // '2023-10-01'
date.format('YYYY年MM月DD日') // '2023年10月01日'
date.format('HH:mm:ss') // '12:30:45'
date.format('YYYY-MM-DD HH:mm:ss') // '2023-10-01 12:30:45'
date.format('ddd') // 'Sun'（星期縮寫，依賴本地化插件）
date.format('X') // 1696149045（秒級時間戳）
date.format('x') // 1696149045000（毫秒級時間戳）
常用占位符說明：
YYYY：4位年份（如 2023）MM：2位月份（01-12）DD：2位日期（01-31）HH：24小時制小時（00-23）hh：12小時制小時（01-12）mm：分鐘（00-59）ss：秒（00-59）X：秒級時間戳x：毫秒級時間戳
2. 解析與驗證（isValid）
檢查日期是否有效（避免無效日期如 2023-02-30）：
dayjs('2023-02-30').isValid() // false（2月沒有30日）
dayjs('2023-13-01').isValid() // false（月份超出范圍）
dayjs('2023-10-01').isValid() // true
3. 時間計算（加減操作）
通過 add 和 subtract 對日期進行增減，支持年、月、日等單位：
const now = dayjs('2023-10-01')
// 加 1 年
now.add(1, 'year').format('YYYY-MM-DD') // '2024-10-01'
// 減 1 個月
now.subtract(1, 'month').format('YYYY-MM-DD') // '2023-09-01'
// 加 7 天
now.add(7, 'day').format('YYYY-MM-DD') // '2023-10-08'
// 加 30 分鐘
now.add(30, 'minute').format('HH:mm') // 假設原時間為 00:00 → '00:30'
支持的單位： year（年）、month（月）、day（日）、hour（時）、minute（分）、second（秒）、millisecond（毫秒）。
4. 時間比較（diff）
計算兩個日期的差值：
const date1 = dayjs('2023-10-01')
const date2 = dayjs('2023-10-08')
// 計算相差的天數
date2.diff(date1, 'day') // 7
// 計算相差的小時數
date2.diff(date1, 'hour') // 168（7×24）
// 不指定單位時，默認返回毫秒數
date2.diff(date1) // 604800000（7×24×60×60×1000）
5. 獲取/設置日期部分（get/set）
獲取或修改日期的年、月、日等部分：
const date = dayjs('2023-10-01 12:30:45')
// 獲取
date.year() // 2023（年份）
date.month() // 9（月份，0 基，10月對應 9）
date.date() // 1（日期）
date.hour() // 12（小時）
date.minute() // 30（分鐘）
date.second() // 45（秒）
// 設置（返回新對象）
date.year(2024).format('YYYY') // '2024'
date.month(10).format('MM') // '11'（設置為 10 → 11月）
date.date(15).format('DD') // '15'
6. 其他常用操作
判斷是否在另一個日期之前/之后/相同：
const a = dayjs('2023-10-01') const b = dayjs('2023-10-02') a.isBefore(b) // true（a 在 b 之前） a.isAfter(b) // false（a 在 b 之后） a.isSame(b, 'day') // false（日期不同） a.isSame(dayjs('2023-10-01 12:00'), 'day') // true（同一天）獲取起始/結束時間：
const date = dayjs('2023-10-01 12:30:45') date.startOf('day').format('HH:mm:ss') // '00:00:00'（當天開始） date.endOf('month').format('YYYY-MM-DD') // '2023-10-31'（當月結束）轉換為原生 Date 對象：
const date = dayjs('2023-10-01') date.toDate() // 原生 Date 對象：Sun Oct 01 2023 00:00:00 GMT+0800
五、插件擴展
Day.js 核心功能簡潔，可通過插件擴展額外能力（如本地化、相對時間計算等）。
1. 本地化（Locale）
默認顯示英文，需引入對應語言包實現中文顯示：
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn' // 引入中文包
dayjs.locale('zh-cn') // 全局設置為中文
dayjs('2023-10-01').format('dddd') // '星期日'
dayjs().format('MMMM') // '十月'
2. 相對時間（RelativeTime）
計算「多久前」「多久后」（需引入插件）：
import dayjs from 'dayjs'
import relativeTime from 'dayjs/plugin/relativeTime'
dayjs.extend(relativeTime) // 擴展插件
dayjs('2023-10-01').fromNow() // 假設當前是 2023-10-08 → '7天前'
dayjs().add(3, 'day').fromNow() // '3天后'
3. 更多插件
AdvancedFormat：擴展更多格式化占位符（如Q季度）WeekOfYear：計算當年的第幾周IsLeapYear：判斷是否為閏年
插件使用方式均為：引入插件 → 調用 dayjs.extend(插件) 激活。
六、與 Moment.js 的區(qū)別
- 體積：Day.js 約 2KB，Moment.js 約 24KB+
- 不可變性：Day.js 操作返回新對象（不可變），Moment.js 默認修改原對象（可變）
- API 兼容性：Day.js 大部分 API 與 Moment.js 一致，遷移成本低
- 插件機制：Day.js 核心功能極簡，通過插件按需擴展；Moment.js 內置功能豐富
七、總結
Day.js 以輕量、高效、API 友好為特點，適合需要處理日期時間的前端項目。核心用法包括：
- 創(chuàng)建 Day.js 對象（
dayjs()） - 格式化（
format()） - 時間計算（
add()/subtract()） - 比較（
diff()/isBefore()等） - 通過插件擴展功能（本地化、相對時間等）
更多細節(jié)可參考 官方文檔。
到此這篇關于JavaScript日期處理庫Day.js使用文檔的文章就介紹到這了,更多相關Day.js使用文檔內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
Three.js中如何使用CSS3DRenderer和CSS3DSprite實現模型標簽文字
在Three.js中,使用CSS3DRenderer和CSS3DSprite可以輕松地實現模型標簽文字的效果,為場景中的模型提供更直觀的信息展示,本文將介紹如何使用這兩個工具來實現模型標簽文字,并提供相應的代碼示例,感興趣的朋友跟隨小編一起看看吧2024-05-05
今天小編就為大家分享一篇layui table 表格上添加日期控件的兩種方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
很多時候，需要對Yii表單model中的對象設置的rules進行判斷，但是有的時候可能需要在提交之前就在客戶端進行驗證。怎么處理呢？接下來通過本文給大家分享yii form 表單提交之前JS在提交按鈕的驗證方法，需要的的朋友參考下2017-03-03
uni-app是一個使用Vue.js開發(fā)跨平臺應用的前端框架,下面這篇文章主要給大家介紹了關于UniApp開發(fā)H5接入微信登錄的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-08-08
微信小程序防止多次點擊跳轉和防止表單組件輸入內容多次驗證功能（函數防抖）
這篇文章主要介紹了微信小程序防止多次點擊跳轉和防止表單組件輸入內容多次驗證功能（函數防抖）,需要的朋友可以參考下2019-09-09
JavaScript是一種無類型語言，但同時JavaScript提供了一種靈活的自動類型轉換的處理方式?；疽?guī)則是，如果某個類型的值用于需要其他類型的值的環(huán)境中，JavaScript就自動將這個值轉換成所需要的類型。2016-07-07
本文主要介紹了如何獲取元素的最終background-color的方法，具有一定的參考價值，下面跟著小編一起來看下吧2017-02-02
最近改了一個公司項目,新增加了一個獲取用戶手機號功能,里面用到了關于獲取用戶信息和用戶手機號的功能,下面這篇文章主要給大家介紹了關于微信小程序獲取用戶手機號碼的相關資料,需要的朋友可以參考下2022-07-07
這篇文章主要介紹了webpack中的publicpath,本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友參考下吧2024-01-01
在我們討論實際實現之前,讓我們先介紹一下DTO,它的含義是什么,何時使用以及 javascript/nodejs 項目中對它的真正需求,需要的朋友可以參考下2023-12-12