npmdayjs：讓 JavaScript 時間處理更簡單

npm dayjs 是一個輕量級的 JavaScript 庫，它專註於時間處理，能夠讓開發者在處理時間的過程中更加方便快捷。

一、簡介

在日常的開發中，我們經常需要對時間進行各種處理，例如格式化輸出、計算時間之間的差值、獲取當前時間等等。然而，JavaScript 的原生 Date 對象提供的方法比較有限，而且很難處理常見的時間格式。因此，社區中湧現了很多針對時間處理的庫，而 Day.js 就是其中的一員。

Day.js 是一個輕量級的 JavaScript 時間庫，它支持鏈式操作、自定義插件和 I18n。它採用了和 Moment.js 相似的 API 設計，但是 Day.js 僅有 2KB 左右的大小，是後者的 1/20 左右。

二、安裝和使用 Day.js

Day.js 通過 npm 安裝：

npm install dayjs

然後我們就可以在項目中使用 Day.js 了：

import dayjs from 'dayjs'

// 獲取當前時間
const now = dayjs()

// 格式化輸出
const formatted = now.format('YYYY-MM-DD HH:mm:ss')

console.log(formatted) // 2022-02-22 12:34:56

Day.js 的 API 設計非常友好，例如獲取當前時間：

const now = dayjs()

now.year() // 獲取當前年份
now.month() // 獲取當前月份（從 0 開始）
now.date() // 獲取當前月份的第幾天
now.hour() // 獲取當前小時
now.minute() // 獲取當前分鐘數
now.second() // 獲取當前秒數
now.millisecond() // 獲取當前毫秒數

三、格式化時間輸出

Day.js 的最常用功能就是格式化時間輸出了。通過 format 函數可以將時間按照指定的格式輸出。

// 創建一個時間
const time = dayjs('2022-02-22T12:34:56')

// 格式化輸出
const formatted = time.format('YYYY年MM月DD日 HH:mm:ss')

console.log(formatted) // 2022年02月22日 12:34:56

Day.js 支持的格式化參數非常豐富，包括：

• YY：年份（後兩位）
• YYYY：年份（四位）
• M：月份（不補 0）
• MM：月份（補 0）
• D：日期（不補 0）
• DD：日期（補 0）
• H：小時（24 小時制、不補 0）
• HH：小時（24 小時制、補 0）
• h：小時（12 小時制、不補 0）
• hh：小時（12 小時制、補 0）
• m：分鐘（不補 0）
• mm：分鐘（補 0）
• s：秒鐘（不補 0）
• ss：秒鐘（補 0）
• SSS：毫秒
• A：上午或下午（大寫）
• a：上午或下午（小寫）
• dddd：星期幾（完整的名稱）
• ddd：星期幾（縮寫）

四、計算時間差值

Day.js 還支持計算時間之間的差值，並且可以按照一定的精度（如年、月、日、小時、分鐘等）進行輸出。

// 創建兩個時間
const start = dayjs('2022-02-22T12:34:56')
const end = dayjs('2022-02-23T14:56:23')

// 計算差值
const diff = end.diff(start, 'hour')

console.log(diff) // 26

在上面的代碼中，我們通過 diff 函數計算 start 和 end 之間的差值，並且指定了輸出單位為小時。

五、自定義插件

Day.js 支持自定義插件，通過自定義插件可以擴展 Day.js 的功能。

例如，我們可以通過一個自定義插件來獲取當前日期的 zodiac（屬相）：

// 定義一個插件
dayjs.extend({
    zodiac: function () {
        const year = this.year()
        const startYear = 1900 // 起始年份
        const zodiacs = ['鼠', '牛', '虎', '兔', '龍', '蛇', '馬', '羊', '猴', '雞', '狗', '豬']
        // 通過算法計算屬相
        return zodiacs[(year - startYear) % 12]
    }
})

// 使用自定義插件
const now = dayjs()

console.log(now.zodiac()) // 狗

六、I18n

Day.js 支持多語言環境，內置了 13 種常見的語言環境，並且可以自定義語言環境。

例如，我們可以切換語言環境，並且使用自定義的語言環境：

// 切換語言環境
dayjs.locale('zh-cn')

// 自定義語言環境
dayjs.locale({
    name: 'mylang',
    weekdays: '星期日_星期一_星期二_星期三_星期四_星期五_星期六'.split('_'),
    weekdaysShort: '周日_周一_周二_周三_周四_周五_周六'.split('_'),
    weekdaysMin: '日_一_二_三_四_五_六'.split('_'),
    months: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('_'),
    monthsShort: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('_')
})

const now = dayjs()

console.log(now.format('YYYY年MM月DD日 dddd', { locale: 'mylang' })) // 2022年02月22日 周二

七、總結

npm dayjs 是一個功能完善、易用性高、輕量級的 JavaScript 時間處理庫。它支持格式化輸出、計算時間差值、自定義插件和 I18n，能夠讓開發者在處理時間的過程中更加方便快捷。同時，Day.js 的大小只有約 2KB 左右，是其他類似時間處理庫大小的 1/20 左右，非常適合在前端項目中使用。