亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb

首頁 > 開發 > JS > 正文

超輕量級的js時間庫miment使用解析

2024-05-06 16:53:57
字體:
來源:轉載
供稿:網友

介紹

Miment 是一個輕量級的時間庫(打包壓縮后只有1K),沒有太多的方法,

Miment的設計理念就是讓你以幾乎為零的成本快速上手,無需一遍一遍的擼文檔

由來

首先 致敬一下Moment,非常好用的一個時間庫,我本身也是Moment重度使用者,用習慣了Moment,一碰到需要處理時間的需求,立馬Moment,不過有時候想想,Moment給我們提供了那么多的功能,但是我們天天用的,也就那么一兩個,剛好最近在寫微信小程序,然后在頁面引入Moment,打包完,包竟然大了200多K,把Moment去掉,就直接少掉200多K,反復試了好幾次,確定一個Moment在小程序里面,占用大概200K的空間。

于是就想自己寫一個類似Moment的精簡的時間庫,于是就有了這個,為什么要叫Miment呢,其實剛開始我是想叫Mini-Moment的,但是考慮到以后可能會經常使用到,打2個單詞中間還要加一個下劃線太累了,所以就把Mini-Moment縮水成Miment了。

開始使用

如果你是直接在瀏覽器里面使用,請下載./dist/miment-min.js到你的項目里面去,然后在頁面引入后即可直接使用miment

<script src='你js存放的目錄/miment-min.js'> </script><script>  miment().format() // 2018-04-09 23:01:58 這是我寫這篇文檔的時候,運行代碼顯示的時間</script>

如果你是在單頁面應用或者nodejs環境下使用,首先你需要使用安裝一下Miment

npm i miment

或者

yarn add miment

然后就可以在你的項目中使用了

import miment from 'miment'miment().format()

API

你也可以猛戳這里看example

API 分為3大類

  • 第一類是返回其他對象的,比如format,返回的是字符串 json返回的是一個josn
  • 第二類是返回miment對象的,你可以在調完一個api后面繼續調用另一個api,也就是我們所說的鏈式調用
  • 第三類是從Date對象繼承的,也就是說Date對象有的方法,miment也同樣有,該類方法建議盡量少用

第一類

1.format 格式化時間 ,format方法也就是我們平時最常用的一個了,他一共接收2個參數,這2個參數都有默認值,不傳就使用默認值

參數名稱 參數類型 參數默認值 是否必傳 說明
格式化的字符串 string 'YYYY-MM-DD hh:mm:ss' N 年YYYY,月MM,日DD,時hh,分mm,秒ss,毫秒SSS,數字星期ww,中文星期WW
是否是格式化一個時間差 boolean false N 比如你要計算的時間是一個倒計時,這個時候也就需要傳true

本著簡單的原則,這里格式化方式沒有做的太靈活,有時候靈活也是一種學習成本,因為你需要記很多的用法,不是嗎?,

注意格式化字符串區分大小寫,記的技巧是大的單位大寫 YYYY MM DD,小的單位小寫 hh mm ss 毫秒跟星期特殊的單獨記,

參數必須嚴格按照說明里面的填寫,多一個或者少一個都認不到,比如YYYY寫成YYY或者YY這樣是識別不了的

第二個參數的用法可以參考 distance函數

示例

 miment().format('YYYY年MM月DD日 hh:mm:ss') // 2018-04-09 23:49:36 miment().format('YYYY/MM/DD hh-mm-ss SSS') // 2018/04/09 23-49-36 568 miment().format('YYYY年MM月DD日 星期WW')   // 2018年04月09日 星期一 miment().format('YYYY年MM月DD日 星期ww')   // 2018年04月09日 星期1 (星期日這邊會顯示星期0)

擴展一下,如果我們只是想獲取年份或者月份或者日,可以這樣用

 miment().format('YYYY')  // 2018 miment().format('MM')   // 04 miment().format('DD')   // 09 miment().format('hh')   // 23 miment().format('mm')   // 57 miment().format('ss')   // 16 miment().format('SSS')  // 063 miment().format('ww')   // 1 miment().format('WW')   // 一

所以,有了這個方法,其實你可以不需要去記大部分原生的方法(getFUllYear,getDate,getDay...),所有的需求一個format搞定,

這就是我們追求的極簡,當然,也會有一丟丟的性能損失,不過個人覺得對于當今的硬件設備,你完全可以忽略這一點點性能。除非你的項目很特殊。

2.json 輸出json格式的時間,不需要參數

直接上代碼

 miment().json()

看輸出

 {   "year": 2018,   "month": 4,   "date": 11,   "hour": 8,   "minute": 57,   "second": 41,   "day": 3,   "milliSecond": 87 }

輸出內容比較簡單,應該很好理解,這里就不對輸出做介紹了,day返回的是星期幾,從0-星期天 1-星期一,以此類推

3.stamp 輸出時間戳,不需要參數

 miment().stamp()

看輸出

1523408529932

會輸出一串代表當前時間的數字,這個對前端基本沒啥用,不過有時候后端的同學會要求傳這個

4.daysInMonth 獲取當前月的天數,不需要參數

  miment().daysInMonth()  // 30

第二類

5.add 增加或減少時間,它接收2個參數

 

參數名稱 參數類型 參數默認值 是否必傳 說明
增量 number 0 N 要增加的時間量,增加傳正數,減少傳負數
增量單位 string 無默認值 Y 要增加的時間單位,可選有YYYY MM DD hh mm ss SSS ww WW

 

單位 的可選參數跟格式化方法format的類似,這么做也是為了方便記憶,只需要記一套方案

同樣地 單位也區分大小寫,記的技巧是大的單位大寫 YYYY MM DD,小的單位小寫 hh mm ss 毫秒跟星期特殊的單獨記,
參數必須嚴格按照說明里面的填寫,多一個或者少一個都認不到,比如YYYY寫成YYY或者YY這樣是識別不了的

 miment().add(1,'DD') // 增加一天 miment().add(1,'YYYY').add(2,'MM').add(-3,'DD') // 增加1年2個月又減回去3天 miment().add(-1,'ww') // 減去一周 --即獲取上周的日期 miment().add(500,SSS) // 增加500毫秒

add返回的值是增加完后的miment對象,所以我們可以在它后面繼續調用miment有的方法。

 miment().add(1,'DD').format()  // 我測試的時候,打印的是 2018-04-12 09:29:55

需要注意的是,當你調完第一類的方法以后,返回的就不是miment對象了,比如format返回的是一個字符串,這個時候你就不能再調用miment上的方法了,

會報錯 Uncaught TypeError: miment(...).format(...).xxx is not a function 因為字符串的原型上面沒有這個方法

 miment().add(1,'DD').format().add(1,'DD') // 報錯

6.distance 計算2個時間的距離 接收2個參數,返回一個miment對象

 

參數名稱 參數類型 參數默認值 是否必傳 說明
起始時間 miment/date/number/string Y 接受4種類型參數,會自動轉換
結束時間 miment/date/number/string N 同上

 

只傳一個起始時間的時候,返回 起始時間 - miment當前時間

起始時間和結束時間都有傳的時候,返回 起始時間 - 結束時間

 miment().distance('2018-04-10 00:00:00') // Mon Dec 29 1969 22:11:51 GMT+0800 (CST) miment().distance(1523408529932)     // Wed Dec 31 1969 07:13:47 GMT+0800 (CST) miment().distance('2018-04-10 00:00:00', new Date()) //Mon Dec 29 1969 22:11:13 GMT+0800 (CST) miment().distance('2018-04-10 00:00:00', '2018-04-11 00:00:00') //Mon Dec 29 1969 22:10:46 GMT+0800 (CST)

你一定注意到了,distance方法返回的時間,竟然都是1969年的? 這實際上是基于1970-01-01 00:00:00的一個毫秒數,
具體請看 百度百科-unix時間,

而我們把兩個時間相減,得到的可能是一個相對來說很小的數(還有可能是負數),所以離1970很近

那我們要怎么顯示我們能看得懂的時間呢? 很簡單 用格式化時間函數format,還記得format函數的第二個參數嗎?

就是專門用來格式化distance計算出來的時間差,只要把第二個參數設為true,就能把當前時間格式化成時間差
我們先來看看第二個參數不傳,或者傳false的時候是什么樣子的

 miment().distance(1523408529932).format('YYYY年MM月DD日 hh時mm分ss秒')    // 1969年12月30日 00時52分16秒 miment().distance(1523408529932).format('YYYY年MM月DD日 hh時mm分ss秒',false) // 1969年12月30日 00時52分16秒

然后我們把第二個參數設為true

 miment().distance(1523408529932).format('YYYY年MM月DD日 hh時mm分ss秒',true) // 00年01月03日 23時08分23秒

7.firstDayOfWeek 獲取 本周的第一天(周日) 不需要參數

  miment().firstDayOfWeek()      // Sun Apr 08 2018 11:27:55 GMT+0800 (CST)  miment().firstDayOfWeek().format() // 2018-04-08 11:27:55

如果想獲取周一呢?周二、三、四、五、六呢?

  miment().firstDayOfWeek().add(1,'DD').format() // 2018-04-09 11:27:55

8.firstDay 獲取每個月的第一天 不需要參數

 miment().firstDay()      // Sun Apr 01 2018 00:00:00 GMT+0800 (CST) miment().firstDay().format() // 2018-04-01 00:00:00

9.lastDay 獲取每個月的最后一天 不需要參數

 miment().lastDay()      // Mon Apr 30 2018 00:00:00 GMT+0800 (CST) miment().lastDay().format() // 2018-04-30 00:00:00

第三類

10.Date自帶方法 miment繼承自Date對象,所以也擁有Date對象的所有方法,這里就不做深入講解,需要更多關于Date對象的說明,

請移步至MDN查看

不過需要注意的是,由于繼承而來的方法是屬于Date對象的,為了保持一致,我們沒有去對方法做改動,所以方法無法返回miment對象,也就是說無法鏈式調用miment

寫在最后

目前這些功能(函數),是我們團隊在日常實踐中碰到的比較常用的,如果你對功能有新的需求或者建議,

歡迎給我們提Issue,如果喜歡miment,

請在我的github上給我一個star,你的star就是我最大的動力了,謝謝!

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持VeVb武林網。


注:相關教程知識閱讀請移步到JavaScript/Ajax教程頻道。
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb
2019中文字幕在线观看| 黑人巨大精品欧美一区二区一视频| 亚洲国产私拍精品国模在线观看| 国精产品一区一区三区有限在线| 91美女高潮出水| 中文字幕自拍vr一区二区三区| 久久成人精品一区二区三区| 国产成人精品视频| 91精品国产亚洲| 国产视频精品久久久| 国产91成人在在线播放| 国产成人一区二区在线| 欧美大片在线看| 久久综合色影院| 91精品视频在线| 国产精品久久久精品| 青青青国产精品一区二区| 色播久久人人爽人人爽人人片视av| 久久精品国产久精国产思思| 性视频1819p久久| 欧美裸身视频免费观看| 国产日韩欧美另类| 青青草精品毛片| 色爱av美腿丝袜综合粉嫩av| www.日韩不卡电影av| 91免费的视频在线播放| 欧美国产日韩精品| 北条麻妃在线一区二区| 欧美成人午夜剧场免费观看| 影音先锋欧美精品| 日韩欧美中文在线| 亚洲一区二区三区在线免费观看| 欧美日韩国产精品一区二区不卡中文| 在线国产精品播放| 久久黄色av网站| 国产这里只有精品| 国产精品美女午夜av| 精品久久久在线观看| 久久久久国产精品一区| 91在线视频成人| 中文字幕欧美日韩精品| 91九色国产社区在线观看| 欧美精品一本久久男人的天堂| 精品色蜜蜜精品视频在线观看| 播播国产欧美激情| 夜夜躁日日躁狠狠久久88av| 亚洲视频网站在线观看| 亚洲区bt下载| 日韩一区视频在线| 久久久久久久影院| 亚洲日本成人女熟在线观看| 狠狠色香婷婷久久亚洲精品| 久久在线视频在线| 亚洲精品福利视频| 欧美乱妇40p| 国产精品日韩在线一区| 免费91在线视频| 中文字幕国内精品| 欧美电影电视剧在线观看| 亚洲综合视频1区| 欧美激情在线一区| 日韩av影片在线观看| 日韩影视在线观看| 国产又爽又黄的激情精品视频| 国产精品美女www爽爽爽视频| 久久国产精品视频| 欧美黑人巨大xxx极品| 日产日韩在线亚洲欧美| 欧美激情精品久久久久久久变态| 久久人人爽人人爽人人片av高请| 韩剧1988在线观看免费完整版| 国产视频精品xxxx| 久热爱精品视频线路一| 992tv成人免费影院| 久久免费精品日本久久中文字幕| 日产日韩在线亚洲欧美| 日韩高清免费在线| 欧美日韩激情网| 日韩h在线观看| 狠狠色噜噜狠狠狠狠97| 45www国产精品网站| 亚洲专区国产精品| 亚洲a级在线播放观看| 5252色成人免费视频| 欧洲美女7788成人免费视频| 成人免费网站在线看| 超碰精品一区二区三区乱码| 久久国产精品影视| 久久九九有精品国产23| 91高潮在线观看| 日韩成人激情在线| 精品国产老师黑色丝袜高跟鞋| 国产女人精品视频| 日韩精品视频在线观看网址| 国产成人自拍视频在线观看| 91成人国产在线观看| 国产精品一二区| 欧美俄罗斯乱妇| 91老司机精品视频| 成人激情在线观看| 亚洲女在线观看| 欧美性理论片在线观看片免费| 国产精品成人av在线| 亚洲黄色在线观看| 亚洲欧美中文日韩在线v日本| 青草成人免费视频| 粉嫩老牛aⅴ一区二区三区| 欧美性精品220| 欧美一区二区三区四区在线| 色婷婷综合久久久久中文字幕1| 精品亚洲一区二区三区四区五区| 国产精品久久久久久久久借妻| 亚洲a区在线视频| 日韩专区中文字幕| 午夜精品一区二区三区在线视频| 国产日韩欧美91| 国产精品美女久久久久av超清| 国产精品一区=区| 国产女精品视频网站免费| 亚洲 日韩 国产第一| 高清一区二区三区日本久| 日韩在线免费视频观看| 中文字幕av一区| 久久久久久69| 国产精品自拍偷拍视频| 菠萝蜜影院一区二区免费| 欧美韩日一区二区| 国产精品视频26uuu| 亚洲男人第一网站| 色婷婷久久一区二区| 久久视频在线直播| 91丝袜美腿美女视频网站| 久久久久中文字幕| xvideos亚洲| 欧美激情一级精品国产| 欧美片一区二区三区| 日韩av电影在线免费播放| 亚洲精品999| 亚洲成人av在线| 欧美精品videosex性欧美| 国产精品久久999| 国产精品欧美日韩久久| 久久成人精品电影| 91av视频导航| 色综合久久中文字幕综合网小说| 91av视频在线| 在线精品播放av| 久久久精品2019中文字幕神马| 午夜精品一区二区三区在线视| 欧美最猛性xxxxx亚洲精品| 91在线无精精品一区二区| 91午夜在线播放| 国产精品久久久一区| 91麻豆国产精品| 久久精品色欧美aⅴ一区二区| 日韩中文字幕免费| 久久久国产精品亚洲一区| 国产盗摄xxxx视频xxx69| 国内精品一区二区三区四区| 成人自拍性视频| 久久精品国产一区二区三区| 欧美日韩另类字幕中文| 国产精品视频公开费视频| 日本韩国欧美精品大片卡二|