国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

dayjs 源碼解析（一）（api）

BlackMass / 714人閱讀

摘要：下面，我將自己閱讀的源碼的過程記錄下來。閱讀庫的代碼，首先先要知道這個庫的作用是一個輕量的時間日期處理庫，其用法和完全一樣。介紹首先，閱讀的源碼，我們應(yīng)該從的入手。對象是不可變的，即所有改變的操作都會返回一個新的實例。

前言

作為一個程序員，閱讀別人優(yōu)秀代碼是提升自己技術(shù)能力的一個很好的方法。下面，我將自己閱讀 dayjs（v1.6.10）的源碼的過程記錄下來。

閱讀庫的代碼，首先先要知道這個庫的作用

dayjs 是一個輕量的 JavaScript 時間日期處理庫，其用法（api）和 Moment.js 完全一樣。

特點

和 Moment.js 相同的 api 和用法

不可變數(shù)據(jù)（Immutable）

支持鏈?zhǔn)讲僮鳎–hainable）

l18n國際化

僅 2kb 大小

全瀏覽器兼容

因為其 api 和 Moment.js 完全相同，所以你可以將之前使用 Moment.js 的項目無痛的遷移使用 dayjs。

API 介紹（v1.6.10）

首先，閱讀 dayjs 的源碼，我們應(yīng)該從 dayjs 的 api 入手。

官方 api 文檔（中文） 官方 api 文檔（英文）

Day.js 沒有修改原生的 Date.prototype，而是在 Date 對象基礎(chǔ)上包裝了一層，叫做 Dayjs 對象。Dayjs 對象是不可變的，即所有改變 Dayjs 的操作都會返回一個新的實例。

其中，api 分為 6 類：

解析

構(gòu)造 dayjs(existing?:string | number | Date | Dayjs)：構(gòu)造一個 Dayjs 實例對象

克隆 .clone() | dayjs(original: Dayjs)：在已有 Dayjs 實例對象的基礎(chǔ)上克隆返回一個新的 Dayjs 實例對象

驗證 .isValid()：驗證該 Dayjs 實例對象是否有效

獲取和設(shè)置

年 .year()

月 .month()

日 .date()

星期幾 .day()

時 .hour()

分 .minute()

秒 .second()

毫秒 .millisecond()

設(shè)置 .set(unit: string, value: number)

操作

添加 .add(value: number, unit: string)

減少 .subtract(value: number, unit: string)

開始的時間 .startOf(unit: string)

結(jié)束的時間 .endOf(unit: string)

展示

格式化 .format(stringWithTokens: string)

差別 .diff(compared: Dayjs, unit: string (default: "milliseconds"), float?: boolean)

Unix 時間戳（毫秒） .valueOf()

Unix 時間戳（秒） .unix()

某月的天數(shù) .daysInMonth()

轉(zhuǎn)換為 JavaScript Date 對象 .toDate

轉(zhuǎn)換為數(shù)組 .toArray()

轉(zhuǎn)換為 JSON .toJSON()

轉(zhuǎn)換為 ISO 8601 標(biāo)準(zhǔn)格式的字符串 .toISOString()

轉(zhuǎn)換為對象 .toObject()

轉(zhuǎn)換為字符串 .toString()

查詢

是否在之前 .isBefore(compared: Dayjs)

是否相同 .isSame(compared: Dayjs)

是否在之后 .isAfter(compared: Dayjs)

是否是 Dayjs 實例對象 isDayjs()

插件

相對時間

是否是閏年

API 詳解（v1.6.10） 解析 構(gòu)造器 dayjs(existing?: string | number | Date | Dayjs)

1.當(dāng)沒有參數(shù)時，會返回一個新的 Dayjs 實例對象，且為當(dāng)前日期和時間

dayjs()

2.當(dāng)參數(shù)為 ISO 8601 標(biāo)準(zhǔn)的字符串時

dayjs("2018-07-01T12:00:00.000Z")

3.當(dāng)參數(shù)為 unix 時間戳?xí)r

dayjs(1318781876406);

4.當(dāng)參數(shù)為一個原生的 JavaScript Date 對象時

dayjs(new Date(2018, 7, 1));

dayjs() 構(gòu)造函數(shù)會返回一個 Dayjs 實例對象

克隆 .clone() | dayjs(original: Dayjs)

會克隆返回一個新的 Dayjs 對象，有兩種方法

// 1.使用 .clone() 方法
dayjs().clone()

// 2.使用 dayjs 構(gòu)造函數(shù)，且傳入的參數(shù)為被克隆的 Dayjs 實例對象
dayjs(dayjs("2018-7-1"))
驗證 .isValid()

返回一個布爾值，表示該 Dayjs 實例對象是否有效

dayjs().isValid()
獲取和設(shè)置 獲取（年，月，日，星期幾，時，分，秒，毫秒） 
// 年
dayjs().year()

// 月 
dayjs().month()

// 日
dayjs().date()

// 星期幾
dayjs().day()

// 時
dayjs().hour()

// 分
dayjs().minute()

// 秒
dayjs().second()

// 毫秒
dayjs().millisecond()

上面返回的值與用原生 Date.prototype 對象下的方法獲取 “年月日...” 的值是一樣的，其實在源碼中，就是使用的 Date 的原生方法獲取的 “年月日...”

設(shè)置 .set(unit: string, value: number)

返回一個新的日期時間被改變的 Dayjs 實例對象

dayjs().set("date", 1) // 設(shè)置 “日” 為 1 日
dayjs().set("month", 3) // 設(shè)置 “月” 為 4 月
dayjs().set("second", 30) // 設(shè)置 “秒” 為 30 秒
操作

Dayjs 實例對象可以使用很多方法操作

dayjs("2018-7-1")
  .add(1, "day")
  .substract(1, "year").toString()
// 在 2018-7-1 基礎(chǔ)上添加 1 天，然后減少 1 年，最后轉(zhuǎn)換為字符串
添加 .add(value: number, unit: string) 
dayjs().add(7. "day")
減少 .subtract(value: number, unit: string) 
dayjs().subtract(7. "year")
開始的時間

返回克隆的以傳入的單位開始時間的 Dayjs 實例對象

dayjs().startOf("week") // 本周開始的時間
結(jié)束的時間

返回克隆的以傳入的單位結(jié)束時間的 Dayjs 實例對象

dayjs().endOf("month") // 本月的結(jié)束時間
展示 格式化 .format(stringWidthTokens: string)

返回一個按照你規(guī)定好的格式化后的字符串

dayjs().format(); // current date in ISO6801, without fraction seconds e.g. "2020-04-02T08:02:17-05:00"

dayjs("2019-01-25").format("{YYYY} MM-DDTHH:mm:ssZ[Z]"); // "{2019} 01-25T00:00:00-02:00Z"

dayjs("2019-01-25").format("DD/MM/YYYY"); // "25/01/2019"

可用的格式

差別 .diff(compared: Dayjs, unit: string (default: "milliseconds"), float?: boolean)

返回兩個 Dayjs 實例對象的時間差

const date1 = dayjs("2019-01-25");
const date2 = dayjs("2018-06-05");
date1.diff(date2); // 20214000000
date1.diff(date2, "months"); // 7
date1.diff(date2, "months", true); // 7.645161290322581
date1.diff(date2, "days"); // 233
unix 時間戳（毫秒） .valueOf() 
dayjs("2019-01-25").valueOf(); // 1548381600000
unix 時間戳（秒） .unix() 
dayjs("2019-01-25").unix(); // 1548381600
某月的天數(shù) .daysInMonth() 
dayjs("2018-7-1").daysInMonth() // 31
轉(zhuǎn)換為（原生 Date 對象 | 數(shù)組 | json | ISO 8601 字符串 | 對象 | 字符串） 
// 1.轉(zhuǎn)換為 原生 Date 對象
dayjs("2019-01-25").toDate() 

// 2.轉(zhuǎn)換為 數(shù)組
dayjs("2019-01-25").toArray() // [ 2019, 0, 25, 0, 0, 0, 0 ]

// 3.轉(zhuǎn)換為 json
dayjs("2019-01-25").toJSON() // "2019-01-25T02:00:00.000Z"

// 4.轉(zhuǎn)換為 ISO 8601 字符串
dayjs("2019-01-25").toISOString() // "2019-01-25T02:00:00.000Z"

// 5.轉(zhuǎn)換為 ISO 8601 字符串
dayjs("2019-01-25").toObject()
/* { years: 2019,
     months: 0,
     date: 25,
     hours: 0,
     minutes: 0,
     seconds: 0,
     milliseconds: 0 } */
     
// 6.轉(zhuǎn)換為 字符串
dayjs("2019-01-25").toString() // "Fri, 25 Jan 2019 02:00:00 GMT"
查詢 是否在之前 .isBefore(compared: Dayjs) 
dayjs().isBefore(dayjs()); // false
是否相同 
dayjs().isSame(dayjs()); // true
是否在之后 
dayjs().isAfter(dayjs()); // false
是否是 Dayjs 實例對象 
dayjs.isDayjs(dayjs()); // true
dayjs.isDayjs(new Date()); // false
是否是閏年（在 1.7.0 版本被棄用，請使用 IsLeapYear plugin 插件替代） 
dayjs("2000-01-01").isLeapYear(); // true
插件 相對時間

使用 .from .to .fromNow .toNow 方法來獲得相對時間

是否是閏年

使用 .from .to .fromNow .toNow 方法來獲得相對時間

下一篇，dayjs 源碼解析（二）（目錄結(jié)構(gòu)）

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/95838.html

相關(guān)文章

  • dayjs 源碼解析（五）（dayjs 插件詳解）

    摘要：前言上一篇源碼解析四類介紹了的源碼目錄結(jié)構(gòu)。接下來，本篇將分析一下中插件功能的用法源碼以及如何編寫自己的插件。并且，可以通過插件選項，來對插件進(jìn)行配置。 前言 上一篇 dayjs 源碼解析（四）（Dayjs 類）介紹了 dayjs 的源碼目錄結(jié)構(gòu)。接下來，本篇將分析一下 dayjs 中插件功能的用法、源碼以及如何編寫自己的 dayjs 插件。 dayjs 插件用法 dayjs 的插件，...

    RaoMeng 評論0 收藏0

  • dayjs 源碼解析（二）（目錄結(jié)構(gòu)）

    摘要：前言上一篇源碼解析一，介紹了一下的，知道了如何使用。本篇，介紹項目的目錄結(jié)構(gòu)。源碼解析三構(gòu)造函數(shù) 前言 上一篇 dayjs 源碼解析（一）（api），介紹了一下 dayjs 的 api，知道了如何使用 dayjs。本篇，介紹 dayjs 項目的目錄結(jié)構(gòu)。 目錄結(jié)構(gòu) showImg(https://segmentfault.com/img/bVbcW0Q?w=229&h=832); 在 ...

    Youngs 評論0 收藏0

  • dayjs 源碼解析（三）（dayjs 構(gòu)造函數(shù)）

    摘要：接下來，本篇將解讀一下中的構(gòu)造函數(shù)。最后將傳入類的構(gòu)造函數(shù)，生成一個對象，作為函數(shù)的返回值給返回了。參數(shù)通過上面對參數(shù)的分析知道了參數(shù)其實是當(dāng)參數(shù)為實例對象時，最后又會調(diào)用函數(shù)，此時才會傳入?yún)?shù)。 前言 上一篇 dayjs 源碼解析（二）（目錄結(jié)構(gòu)）介紹了 dayjs 的源碼目錄結(jié)構(gòu)。接下來，本篇將解讀一下 index.js 中的 dayjs 構(gòu)造函數(shù)。 dayjs 構(gòu)造函數(shù) // ...

    ityouknow 評論0 收藏0

  • dayjs 源碼解析（四）（Dayjs 類）

    摘要：前言上一篇源碼解析三構(gòu)造函數(shù)介紹了的源碼中的函數(shù)。接下來，本篇將解讀一下中的類。首先，我們看的構(gòu)造函數(shù)，該構(gòu)造函數(shù)調(diào)用了實例方法，傳入?yún)?shù)在上一篇有講到。下一篇源碼解析五插件詳解 前言 上一篇 dayjs 源碼解析（三）（dayjs 構(gòu)造函數(shù)）介紹了 dayjs 的源碼中的 dayjs 函數(shù)。接下來，本篇將解讀一下 index.js 中的 Dayjs 類。 class Dayjs { ...

    BicycleWarrior 評論0 收藏0

  • ?Day.js 2kB超輕量時間庫 和Moment.js一樣的API

    showImg(https://segmentfault.com/img/bV9wV7?w=1952&h=712);Moment.js 是一個大而全的 JS 時間庫，很大地方便了我們處理日期和時間。但是 Moment.js太重了(200k+ with locals)，可能一般項目也只使用到了她幾個常用的API。雖然社區(qū)也有幾個輕量的時間庫，要想遷移過去又會增加新的學(xué)習(xí)和遷移成本。 如果能有一個和 ...

    CoreDump 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<