Moment.js在管理JavaScript中的日期方面有很大的幫助
Moment.js是一個很棒的JavaScript庫,可幫助您在瀏覽器和Node.js中管理日期。
本文旨在解釋該庫的基礎知識和最常用的用法。
安裝
您可以使用來自unpkg.com的腳本標記將其直接包含在頁面中:
<script src="https://unpkg.com/moment" />
或使用npm:
npm install moment
如果您使用npm進行安裝,則需要導入軟件包(使用ES模塊):
import moment from 'moment'
或要求它(使用普通JS):
const moment = require('moment')
獲取當前日期和時間
const date = moment()
解析日期
可以通過將一個字符串對像傳遞給一個日期來對其進行初始化:
const date = moment(string)
它接受根據(按順序)解析的任何字符串:
- ISO 8601
- RFC 2822日期時間格式
- Date對象接受的格式
ISO 8601絕對是最方便的。這是格式參考:
格式 | 意義 | 例子 |
---|---|---|
YYYY | 4位數字年份 | 2018 |
YY | 兩位數年份 | 18歲 |
中號 | 2位數字月份號,省略前導0 | 7 |
毫米 | 2位數字月份號 | 07 |
MMM | 3個字母的月份名稱 | 七月 |
MMMM | 全月名稱 | 七月 |
dddd | 全天名稱 | 星期日 |
gggg | 4位數字的周年 | 2018 |
gg | 2位數字的星期年 | 18歲 |
w | 一年中的周,不帶零 | 18歲 |
w | 一年中的前零週 | 18歲 |
Ë | Day of the week, starts at 0 | 4 |
d | 2位數字的日數,省略前導0 | 9 |
DD | 2位數的日號 | 09 |
做 | 帶序號的天數 | 第九名 |
Ť | 指示時間部分的開始 | |
H | 2位數小時(24小時制),從0到23 | 22 |
H | 2位數小時(24小時制),從0到23,前導0 | 22 |
kk | 2位數小時(24小時制),從1到24 | 23 |
ķ | 2位數小時(24小時制),從1到24,不加0 | 23 |
A / A | am 或者pm |
下午 |
h | 2位數小時(12小時時間) | 11 |
毫米 | 2位數字分鐘 | 22 |
ss | 2位數秒 | 40 |
s | 2位秒,不帶前導零 | 40 |
小號 | 1位數毫秒 | 1 |
黨衛軍 | 2位毫秒 | 12 |
SSS | 3位數毫秒 | 123 |
ž | 時區 | +02:00 |
X | UNIX時間戳(以毫秒為單位) | 1410432140575 |
設定日期
格式化日期
當您要輸出純JavaScript Date對象的內容時,幾乎沒有什麼選擇可以確定格式。您所能做的就是使用內置方法,並根據需要編寫日期。
Moment提供了一種方便的方式來根據您的需要設置日期格式,方法是使用format()
方法:
date.format(string)
字符串格式接受與我在上面的“解析日期”部分中描述的格式相同的格式。
例子:
moment().format("YYYY Do MM")
Moment提供了一些常量,您可以使用它們來代替編寫自己的格式:
持續的 | 格式 | 例子 |
---|---|---|
moment.HTML5_FMT.DATETIME_LOCAL |
YYYY-MM-DDTHH:mm | 2017-12-14T16:34 |
moment.HTML5_FMT.DATETIME_LOCAL_SECONDS |
YYYY-MM-DDTHH:mm:ss | 2017-12-14T16:34:10 |
moment.HTML5_FMT.DATETIME_LOCAL_MS |
YYYY-MM-DDTHH:mm:ss.SSS | 2017-12-14T16:34:10.234 |
moment.HTML5_FMT.DATE |
YYYY-MM-DD | 2017-12-14 |
moment.HTML5_FMT.TIME |
高度:毫米 | 16:34 |
moment.HTML5_FMT.TIME_SECONDS |
HH:mm:ss | 16:34:10 |
moment.HTML5_FMT.TIME_MS |
HH:mm:ss.SSS | 16:34:10.234 |
moment.HTML5_FMT.WEEK |
YYYY- [W] WW | 2017-W50 |
moment.HTML5_FMT.MONTH |
YYYY-MM | 2017-12 |
驗證日期
可以使用isValid()
方法:
moment('2018-13-23').isValid() //false
moment('2018-11-23').isValid() //true
時間以前,直到日期
使用fromNow()
。字符串已本地化:
moment('2016-11-23').fromNow() //2 years ago
moment('2018-05-23').fromNow() //a month ago
moment('2018-11-23').fromNow() //in 5 months
如果你通過true
到fromNow()時,它僅顯示差異,而沒有引用future / past。
moment('2016-11-23').fromNow(true) //2 years
moment('2018-05-23').fromNow(true) //a month
moment('2018-11-23').fromNow(true) //5 months
處理日期
您可以在日期中添加或減去任何時間:
moment('2016-11-23').add(1, 'years')
moment('2016-11-23').subtract(1, 'years')
您可以使用這些值:
years
quarters
months
weeks
days
hours
minutes
seconds
milliseconds
免費下載我的JavaScript初學者手冊
更多js教程:
- JavaScript中應避免的事情(不良部分)
- JavaScript中的延遲和承諾(+ Ember.js示例)
- 如何使用JavaScript將文件上傳到服務器
- JavaScript編碼風格
- JavaScript數組簡介
- JavaScript編程語言簡介
- 完整的ECMAScript 2015-2019指南
- 了解JavaScript承諾
- JavaScript的詞彙結構
- JavaScript類型
- JavaScript變數
- 示例Web應用程序提示列表
- JavaScript函數式編程簡介
- 具有Async和Await的現代異步JavaScript
- JavaScript循環和範圍
- Map JavaScript數據結構
- 設置JavaScript數據結構
- JavaScript模板文字指南
- 學習JavaScript的路線圖
- JavaScript表達式
- 發現JavaScript計時器
- JavaScript事件說明
- JavaScript循環
- 使用map,filter,reduce和find編寫JavaScript循環
- JavaScript事件循環
- JavaScript函數
- JavaScript詞彙表
- JavaScript閉包說明
- JavaScript Arrow函數教程
- JavaScript正則表達式指南
- 如何在JavaScript中檢查字符串是否包含子字符串
- 如何從JavaScript中的數組中刪除項目
- 如何深度克隆JavaScript對象
- Introduction to Unicode and UTF-8
- JavaScript中的Unicode
- 如何在JavaScript中大寫字符串的第一個字母
- 如何在JavaScript中將數字格式化為貨幣值
- 如何在JavaScript中將字符串轉換為數字
- 這在JavaScript中
- 如何在JavaScript中獲取當前時間戳
- JavaScript嚴格模式
- JavaScript立即調用函數表達式(IIFE)
- 如何使用JavaScript重定向到另一個網頁
- 如何從JavaScript對像中刪除屬性
- 如何在JavaScript中將項目追加到數組
- 如何檢查JavaScript對象屬性是否未定義
- ES模塊簡介
- CommonJS簡介
- JavaScript異步編程和回調
- 如何替換JavaScript中所有出現的字符串
- 現代JavaScript語法快速參考指南
- 如何在JavaScript中修剪數字中的前導零
- 如何檢查JavaScript對象
- 關於JavaScript日期的權威指南
- Moment.js教程
- JavaScript中的分號
- JavaScript算術運算符
- JavaScript Math對象
- 在JavaScript中生成隨機且唯一的字符串
- 如何使您的JavaScript函數進入睡眠狀態
- JavaScript原型繼承
- JavaScript例外
- 如何使用JavaScript類
- JavaScript食譜
- JavaScript中的引號
- 如何在JavaScript中驗證電子郵件地址
- 如何獲取JavaScript數組中一組對象的唯一屬性
- 如何在JavaScript中檢查字符串是否以另一個字符串開頭
- 如何在JavaScript中創建多行字符串
- ES6指南
- 如何在JavaScript中獲取當前URL
- ES2016指南
- 如何使用JavaScript中的值初始化新數組
- ES2017指南
- ES2018指南
- 如何在Array.prototype.map()中使用Async和Await
- 異步與同步代碼
- 如何在JavaScript中生成兩個數字之間的隨機數
- HTML Canvas API教程
- 如何在JavaScript中的for-of循環中獲取迭代的索引
- 什麼是單頁應用程序?
- WebAssembly簡介
- JSON簡介
- JSONP指南
- Should you use or learn jQuery in 2020?
- 如何使用純JavaScript隱藏DOM元素
- 如何在JavaScript中合併兩個對象
- 如何清空JavaScript數組
- 如何使用JavaScript編碼URL
- 如何在JavaScript中設置默認參數值
- 如何在JavaScript中按屬性值對對像數組進行排序
- 如何計算JavaScript對像中的屬性數量
- JavaScript中的call()和apply()
- WebRTC庫PeerJS簡介
- 使用Rest和Spread處理對象和數組
- 用JavaScript分解對象和數組
- 調試JavaScript的權威指南
- TypeScript指南
- 在JavaScript中動態選擇對象的方法
- 將undefined傳遞給JavaScript立即調用的函數表達式
- 鬆散類型與強類型語言
- 如何使用JavaScript設置DOM元素的樣式
- 用JavaScript投放
- JavaScript生成器教程
- node_modules文件夾的大小不是問題。這是一種特權
- 在JavaScript中導入模塊時如何解決意外的標識符錯誤
- 如何在JavaScript中列出對象的所有方法
- 字符串replace()方法
- 字符串search()方法
- 我如何運行一些JavaScript代碼段
- ES2019指南
- 字符串charAt()方法
- 字符串charCodeAt()方法
- 字符串codePointAt()方法
- 字符串concat()方法
- 字符串endsWith()方法
- 字符串include()方法
- 字符串indexOf()方法
- 字符串lastIndexOf()方法
- 字符串localeCompare()方法
- 字符串match()方法
- 字符串normalize()方法
- 字符串padEnd()方法
- 字符串padStart()方法
- 字符串repeat()方法
- 字符串slice()方法
- 字符串split()方法
- 字符串startsWith()方法
- String substring()方法
- 字符串toLocaleLowerCase()方法
- 字符串toLocaleUpperCase()方法
- String toLowerCase()方法
- 字符串toString()方法
- String toUpperCase()方法
- 字符串trim()方法
- String trimEnd()方法
- String trimStart()方法
- JavaScript的記憶化
- 字符串valueOf()方法
- JavaScript參考:字符串
- Number isInteger()方法
- Number isNaN()方法
- Number isSafeInteger()方法
- Number parseFloat()方法
- Number parseInt()方法
- Number toString()方法
- Number valueOf()方法
- Number toPrecision()方法
- Number toExponential()方法
- Number toLocaleString()方法
- Number toFixed()方法
- Number isFinite()方法
- JavaScript參考:編號
- JavaScript屬性描述符
- 對象的assign()方法
- 對象的create()方法
- Object defineProperties()方法
- Object defineProperty()方法
- 對象entry()方法
- 對象Frozen()方法
- Object getOwnPropertyDescriptor()方法
- Object getOwnPropertyDescriptors()方法
- Object getOwnPropertyNames()方法
- Object getOwnPropertySymbols()方法
- Object getPrototypeOf()方法
- Object is()方法
- Object isExtensible()方法
- Object isFrozen()方法
- Object isSealed()方法
- 對象keys()方法
- 對象的preventExtensions()方法
- 對象seal()方法
- Object setPrototypeOf()方法
- Object values()方法
- 對象的hasOwnProperty()方法
- Object isPrototypeOf()方法
- 對象的propertyIsEnumerable()方法
- Object toLocaleString()方法
- Object toString()方法
- Object valueOf()方法
- JavaScript參考:對象
- JavaScript賦值運算符
- JavaScript國際化
- JavaScript typeof運算子
- JavaScript新運算符
- JavaScript比較運算符
- JavaScript運算符優先級規則
- JavaScript instanceof運算符
- JavaScript陳述式
- JavaScript範圍
- JavaScript類型轉換(廣播)
- JavaScript相等運算符
- JavaScript if / else條件
- JavaScript切換條件
- JavaScript刪除運算符
- JavaScript函數參數
- JavaScript Spread運算符
- JavaScript返回值
- JavaScript邏輯運算符
- JavaScript三元運算符
- JavaScript遞歸
- JavaScript對象屬性
- JavaScript錯誤對象
- JavaScript全局對象
- JavaScript filter()函數
- JavaScript map()函數
- JavaScript reduce()函數
- JavaScript`in`運算子
- JavaScript運算子
- 如何在JavaScript中獲取CSS屬性的值
- 如何將事件偵聽器添加到JavaScript中的多個元素
- JavaScript私有類字段
- 如何在JavaScript中按日期值對數組排序
- JavaScript公共類字段
- JavaScript符號
- 如何使用JavaScript bcrypt庫
- 使用對象解構時如何重命名字段
- 如何在不使用TypeScript的情況下檢查JavaScript中的類型
- 如何檢查JavaScript數組是否包含特定值
- 雙重否定運算符是什麼!用JavaScript做嗎?
- JavaScript比較中應使用哪個等號運算符? == vs ===
- JavaScript仍然值得學習嗎?
- 如何在JavaScript中返回異步函數的結果
- 如何在JavaScript中檢查對像是否為空
- 如何突破JavaScript中的for循環
- 如何在JavaScript中的特定索引處將項目添加到數組
- 為什麼不應該修改JavaScript對象原型
- 在JavaScript中使用let和var有什麼區別?
- 用於激活JavaScript功能的鏈接
- 如何在JavaScript中連接兩個字符串
- 如何在JavaScript中連接兩個數組
- 如何檢查JavaScript值是否為數組?
- 如何在JavaScript中獲取數組的最後一個元素?
- 如何使用Axios發送urlencoded數據
- 如何使用JavaScript獲取明天的日期
- 如何使用JavaScript獲取昨天的日期
- 如何從JavaScript日期獲取月份名稱
- 如何檢查兩個日期是否在JavaScript中是同一天
- 如何在JavaScript中檢查日期是否指向過去的一天
- 標有JavaScript的語句
- 如何等待2個或更多的Promise在JavaScript中解析
- 如何在JavaScript中獲取兩個日期之間的日期
- 如何使用提取上傳文件
- 如何在JavaScript中格式化日期
- 如何遍歷JavaScript中的對象屬性
- 如何在JavaScript中計算兩個日期之間的天數
- 如何在ES模塊中使用頂級等待
- JavaScript動態導入
- JavaScript可選鏈接
- 如何在JavaScript中替換字符串內的空格
- JavaScript空合併
- 如何在JavaScript中展平數組
- JavaScript的十年
- 如何使用Axios發送授權標頭
- JavaScript中的關鍵字和保留字列表
- 如何在JavaScript中將數組轉換為字符串
- 如何刪除所有的node_modules文件夾內容
- 如何從JavaScript數組中刪除重複項
- 在JavaScript中讓vs const
- 各種JavaScript庫中的相同POST API調用
- 如何在JS中獲取數組中的前n個項目
- 如何在JS中將數組劃分為多個相等的部分
- 如何減慢JavaScript中的循環
- 如何在HTML畫布中加載圖像
- 如何在JavaScript中將字符串切成單詞
- 如何在JavaScript中將數組分成兩半
- 如何將文本寫入HTML畫布
- 如何在JavaScript中刪除字符串的最後一個字符
- 如何在JavaScript中刪除字符串的第一個字符
- 如何修復TypeError:無法分配為只讀對象“#&lt; Object&gt;”的屬性“ exports”錯誤
- 如何創建退出意圖彈出窗口
- 如何檢查一個元素是否是另一個元素的後代
- 如何對每個Axios請求強制使用憑據
- 如何解決JavaScript中的“不是函數”錯誤
- 蓋茨比,如何更改圖標
- 使用Gatsby加載外部JS文件
- 如何使用JavaScript檢測暗模式
- 包裹,如何修復“ regeneratorRuntime未定義”錯誤
- 如何檢測Adblocker是否與JavaScript一起使用
- 使用TypeScript中的類型進行對象分解
- Deno手冊:Deno的簡要介紹🦕
- 如何使用JavaScript獲取路徑或URL的最後一段
- 如何隨機播放JavaScript數組中的元素
- 如何檢查JavaScript對像中是否存在密鑰
- 事件冒泡和事件捕獲
- event.stopPropagation與event.preventDefault()與在DOM事件中返回false
- JavaScript中的原始類型與對象
- 在JavaScript中,如何判斷值的類型?
- 如何從JavaScript中的函數返回多個值
- JavaScript中的箭頭函數與常規函數
- 我們可以通過哪些方式訪問對象屬性的值?
- JavaScript中的null和undefined有什麼區別?
- 方法和函數有什麼區別?
- 我們可以通過哪些方法擺脫JavaScript循環?
- JavaScript for..of循環
- 什麼是JavaScript中的對象解構?
- JavaScript吊起了什麼?
- 如何使用JavaScript將逗號更改為點
- 使用DOM時計時的重要性
- 如何反轉JavaScript數組
- 如何在JavaScript中檢查值是否為數字
- 如何在JavaScript函數中接受無限的參數
- JavaScript代理對象
- 使用香草JavaScript在瀏覽器中進行事件委託
- JavaScript super關鍵字
- XState簡介
- 值是通過引用傳遞還是通過JavaScript中的值傳遞?
- JavaScript中的自定義事件
- JavaScript中的自定義錯誤
- JavaScript中的命名空間
- JavaScript中逗號的奇怪用法
- JavaScript中的鏈接方法調用
- 如何處理承諾拒絕
- 如何在JavaScript中交換兩個數組元素
- 如何在使用Gitbook時解決“ cb.apply不是函數”錯誤
- 如何在JavaScript中的數組開頭添加項目
- Gatsby,修復“找不到模塊gatsby-cli / lib / reporter”錯誤
- 如何獲取JavaScript數組中項目的索引
- 如何在JavaScript中測試空對象
- 如何將對象解構為JavaScript中的現有變量
- 數組JavaScript數據結構
- 堆棧JavaScript數據結構
- JavaScript數據結構:隊列
- JavaScript數據結構:集
- JavaScript數據結構:字典
- JavaScript數據結構:鏈接列表
- JavaScript,如何導出函數
- JavaScript,如何導出多個功能
- JavaScript,如何退出功能
- JavaScript,如何在字符串中查找字符
- JavaScript,如何過濾數組
- JavaScript,如何擴展類
- JavaScript,如何在數組中查找重複項
- JavaScript,如何替換數組的項
- JavaScript算法:線性搜索
- JavaScript算法:二進制搜索
- JavaScript算法:選擇排序
- JavaScript算法:Quicksort
- JavaScript算法:合併排序
- JavaScript算法:冒泡排序