Day.js - 一套輕量級的時間處理套件

Day.js 介紹

Day.js 是一套非常輕量的時間處理套件，具有以下特點。

1. 很輕量

如果只需要簡單功能，不使用套件的話，核心包僅有 2KB。

2. 易上手

Day.js 設計非常輕巧，使用簡單，且與知名時間處理套件 moment 的使用方式幾乎相同，如果曾使用過 moment，那上手 Day.js 會非常快。

3. 不可變

Day.js 所有方法都會返回全新 Dayjs 物件，這能避免修改到原始資料，減少 bug 產生。

4. 多語系

Day.js 支援多語系。

安裝方式

Day.js 可執行於瀏覽器及 Node 環境。

1. Node

// 首先執行指令安裝 Day.js
npm install dayjs --save

// 引入 Day.js
const dayjs = require('dayjs')

// 或使用 ES6 import 方式引入 Day.js
import dayjs from 'dayjs'

// 使用 Day.js
dayjs().format()

2. CDN

<!-- CDN 引入 Day.js -->
<script src="https://unpkg.com/dayjs@1.8.21/dayjs.min.js"></script>

<script>
  // 使用 Day.js
  dayjs().format()
</script>

使用方式

// 取得目前時間
const now = dayjs() // 等同 dayjs(new Date())

// 可傳入 Data 物件取得目前時間
const now = dayjs(new Date())

// 取得指定時間
const date = new Date(2018, 8, 18)

// 解析日期
const date = dayjs('01-10-2020', 'MM-DD-YYYY)

// 解析日期 - 嚴格模式，包含符號
const data = dayjs('01-10-2020', 'MM-DD-YYYY， true)

取得 UTC 時間

dayjs.extend(utc)

// 取得本地時間
dayjs().format() //2019-03-06T08:00:00+08:00

// 取得 UTC 時間
dayjs.utc().format() // 2019-03-06T00:00:00Z

取得新的實例

const a = dayjs()
const b = a.clone()

驗證返回的時間是否正確

dayjs(null).isValid() // false
dayjs().isValid() // true

GET 或 SET

// 取得毫秒
dayjs().millisecond()
// 設定毫秒，如傳入數字在 0-999 範圍外，會進位到秒。
dayjs().millisecond(100)

// 取得秒
dayjs().seconds()
// 設定秒，如傳入數字在 0-59 範圍外，會進位到分鐘。
dayjs().seconds(30)


// 取得分鐘
dayjs().minute()
// 設定秒，如傳入數字在 0-59 範圍外，會進位到小時。
dayjs().minute(30)

// 取得小時
dayjs().hour()
// 設定小時，如傳入數字在 0-23 範圍外，會進位到天數。
dayjs().hour(12)

// 取得天數
dayjs().date()
// 設定天數，如傳入數字在 0-月份天數 範圍外，會進位到月份。
dayjs().date(1)

// 取得星期(幾)
dayjs().day()
// 設定星期(幾)，如傳入數字在 0-6 範圍外，會進位到週。
dayjs().day(0)

// 取得月份
dayjs().month()
// 設定月份，如傳入數字在 0-11 範圍外，會進位到年。
dayjs().month(6)

// 取得年份
dayjs().year()
// 設定年份
dayjs().year(2020)

顯示

// 默認返回 ISO 8601 時間字串，例：'2020-05-15T10:59:34+08:00'
dayjs().format() 

// 返回 'YYYYescape 2019-01-25T00:00:00-02:00Z'
dayjs('2019-01-25').format('[YYYYescape] YYYY-MM-DDTHH:mm:ssZ[Z]') 

// 返回 '25/01/2019'
dayjs('2019-01-25').format('DD/MM/YYYY') 

請參考：格式化規則列表

套件使用

Day.js 核心包只包含常用功能，要使用其他功能需引入相關套件

可使用套件如下

小結

Day.js 還有許多客製化及 i18n 的相關設定可以在官方說明中查看，如果專案需要做簡單的時間處理，不妨可以考慮使用 Day.js 這套輕量級的時間處理套件。

參考資料

Day.js 官網