時間不等人,但 Moment.js 可以等你解決時間問題!

来源:https://www.cnblogs.com/tanggoahead/archive/2023/05/25/17430381.html
-Advertisement-
Play Games

比如老王我,用npm init新建一個包,改把改把,然後來個npm publish,so easy ✌️!Too young too naive, baby


前言

一直以來,處理時間和日期的JavaScript庫,選用的都是Moment.js。它的API清晰簡單,使用方便靈巧,功能還特別齊全。
我是Moment.js的重度使用者。凡是遇到時間和日期的操作,就把Moment.js引用上。

簡介

Moment.js是一款常用於JavaScript日期時間處理的代碼庫,它能夠解析、驗證、操作以及格式化日期和時間。

在這裡插入圖片描述

在實際開發中,我們經常需要對日期時間進行轉換、計算等操作,這時候就可以用到Moment.js,提高開發效率,減少工作量。

API

Moment.js 提供了豐富的 API 支持,如以下列出的幾個方法:

  1. 解析與驗證日期時間
    Moment.js 可以解析多種不同格式的日期字元串並將其轉換為 Moment 對象。例如,你可以使用 .moment() 初始化Moment對象,解析一個字元串或者日期對象:
var date = moment("2022-10-01"); // 從字元串創建一個 moment 對象
console.log(date.isValid()); // true
  1. 格式化日期時間
    Moment.js 能夠將日期時間格式化成各種樣式的字元串輸出,如下所示:
moment('2023-05-26').format('YYYY-MM-DD'); // "2023-05-26"
moment().format('MMMM Do YYYY, h:mm:ss a'); // "May 26th 2023, 11:31:23 am"
moment().format('dddd');                    // "Friday"
moment().format("MMM Do YY");               // "May 26th 23"
  1. 時間加減
    Moment.js 提供了方便的API支持時間段的加減計算,如下所示:
moment().add(7, 'days');                  // 7 天之後
moment().subtract(1, 'months');           // 1 個月之前
  1. 時間差計算
    Moment.js以duration對象的形式返回兩個時間之間的差異:
var a = moment([2023, 3, 15]);
var b = moment([2023, 5, 21]);

var result = moment.duration(b.diff(a));
console.log(result.asDays());   //67

關於Moment.js的API還遠不只是這些。更多的內容,請查看下方地址:

官方地址: Moment.js | Home (momentjs.com)
中文網站:Moment.js 中文網 (momentjs.cn)

小結

Moment.js 是一個大而全的時間日期庫,極大方便了我們在 JavaScript 中計算時間和日期。作為一個個誕生於 2011 年的元老級明星項目,有一個壞消息和一個好消息。

壞消息:這個項目已經停止開發,進入維護狀態。 好消息:這個項目還沒掛,大型的框架,如VUE,
React等框架中的各系列版本都或多或少的使用著這個項目。

用官方的話來說:It is not dead, but it is indeed done.(沒掛,但該寫的都寫完啦!)

總的來說, Moment.js 是一款非常實用的 JavaScript 庫,拓展了 JS 對日期處理能力的極限,可以幫助你有效地減少很多重覆勞動,提高開發效率。同時它的API也非常清晰簡潔易懂,在使用中遇到疑難問題可以很容易找到解決方案。無論是初學者還是資深工程師,都值得一試!


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 原本我以為《3萬5千英語句子英語例句大全ACCESS資料庫》例句已經夠多了,沒想到今天遇到一個10萬條英語單詞例句的數據,非常適合與單詞詞典進行關聯學習,例句多了單詞的用法以及句子的掌握都更有效率,例句多了單詞的用法以及句子的掌握都更有效率,例句多了單詞的用法以及句子的掌握都更有效率,例句多了單詞的 ...
  • CSS中,*的作用是通配表示“全部”。遺憾的是,並沒有一種通配元素名的方法。 例如,我有好幾個東西class都標記為了my-element-序號,就像這樣: ```html ... ``` 我現在希望讓所有這些class的東西都應用同一個css規則。可惜,css並不支持這麼一種寫法: ```css ...
  • 近日在編寫一個小程式,將日記功能移植到小程式中,雖然在手機端寫日記一般用不到Markdown,但是仍想在小程式中查看在電腦端寫的Markdown格式的內容,如代碼塊等。 經過查詢,找到一個被廣泛使用的解決方案是towxml 現記錄如下: > 首先將代碼克隆下來 ```js git clone htt ...
  • > 效果預覽 ![調節頁面.gif](https://wansherry.com/api/fc01e2c58219126e20367e856ebad24c.gif) > 關鍵代碼 ```javascript //調節視窗大小 useEffect(() => { if (conref.current) ...
  • 這裡給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 在業務中,有這麼一種場景,表格下的某一列 ID 值,文本超長了,正常而言會是這樣: 通常,這種情況都需要超長省略溢出打點,那麼,就會變成這樣: 但是,這種展示有個缺點,3 個 ID 看上去就完全一致了,因此,PM 希望能夠實現頭部省略打點 ...
  • 隨著項目的發展,前端SPA應用的規模不斷加大、業務代碼耦合、編譯慢,導致日常的維護難度日益增加。同時前端技術的發展迅猛,導致功能擴展吃力,重構成本高,穩定性低。因此前端微服務應運而生。 ...
  • 1. 動畫 動畫(animation)是CSS3中具有顛覆性的特征之一,可以通過設置都各節點來精確控制一個或一組動畫,常用來實現複雜的動畫效果。 相比較過度,動畫可以實現更多變化,更多控制,連續自動播放等效果。 1.1 動畫的基本使用 製作動畫分為兩步: (1)先定義動畫。 (2)再使用(調用)動畫 ...
  • Iframe是一個歷史悠久的HTML元素,根據MDN WEB DOCS官方介紹,Iframe定義為HTML內聯框架元素,表示嵌套的Browsing Context,它能夠將另一個HTML頁面嵌入到當前頁面中。Iframe可以廉價實現跨應用級的頁面共用,並且具有使用簡單、高相容性、內容隔離等優點,因此... ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...