JavaScript >> Javascript 文檔 >  >> Tags >> Date

快速提示:使用 moment.js 像老闆一樣處理日期和時間

你不只是討厭使用 JavaScript 的日期和時間函數嗎?您是否看到簡單地打印自某個事件以來已經過去了多少時間需要多少代碼?幸運的是,有一個名為 moment.js 的小型 JavaScript 庫,您可以將其放入您的網站文件夾並立即使用。

你可以用它做一些很酷的事情

第一站是創建一個新的時刻對象。這是通過調用全局 moment() 函數來完成的。如果您將其留空,它將使用當前時間。否則,您可以傳遞時間戳、數組或字符串,其格式將被解析為日期。

創建時刻對象

// Create a new moment object
var now = moment();

// Create a moment in the past, using a string date
var m = moment("April 1st, 2005", "MMM-DD-YYYY");

// Create a new moment using an array
var m = moment([2005, 3, 1]);

請注意,就像在 JavaScript Date() 對像中一樣,月份從零開始,所以 3 是四月。

與時間合作

// What time is it?
console.log(moment().format('HH:mm:ss')); // 16:13:11

// What day of the week is it?
var day = moment().day(); // 5
console.log( moment.weekdays[day] ); // Friday

// What is the current month name?
console.log( moment.months[moment().month()] ); // August

// What time is it in London? (time zone: UTC)
console.log( moment.utc().format('HH:mm:ss') ); // 13:23:41

// What time is it in Japan? (time zone: UTC+9)
console.log( moment.utc().add('hours',9).format('HH:mm:ss') ); // 22:23:41

如您所見,格式方法是將時刻對象轉換為可讀對象所需的方法。有很多格式選項可供選擇,而且比 PHP 的日期函數更容易記住。

使用日期

// How old are you?
var m = moment("Mar 26th, 1989", "MMM-DD-YYYY");

console.log('You are '+m.fromNow() + ' old'); // You are 23 years ago old

// Oops. We better leave the "ago" part out:
console.log('You are '+m.fromNow(true) + ' old'); // You are 23 years old

// When will the next world cup be?
console.log( moment('June 12th, 2014','MMM DD YYYY').fromNow() ); // in 2 years

// What will be the date 7 days from now?
console.log( moment().add('days',7).format('MMMM Do, YYYY') ); // September 7th, 2012

fromNow() 方法在產生可讀的時間差方面非常有用。它會自動將返回的周期從秒調整為年。

持續時間

// Find the duration between two dates
var breakfast = moment('8:32','HH:mm');
var lunch = moment('12:52','HH:mm');
console.log( moment.duration(lunch - breakfast).humanize() + ' between meals' ) // 4 hours between meals

duration 方法需要幾毫秒並創建一個新對象。通過使用它的humanize()方法,我們得到了人類可讀的版本。

沒有時間可以浪費了!

我希望這個簡短的概述能讓您很好地了解 moment.js 的可能性。如果您想了解更多信息,請關注 github 上的項目並閱讀其主頁上的示例和文檔。


下一篇
No
Tutorial JavaScript 教程
  1. 高級 JavaScript 系列 - 第 4.2 部分:範圍鍊及其工作、詞法和變量環境

  2. 如何在 Material UI 中使用 React Hook Form

  3. Postgres 給那些連不上的人,第 2 部分 - 使用 Node 和 JSON

  4. 如何使用 NodeJS 創建 CLI

  5. 套接字集群。最被低估的框架。第 2 部分:一個簡單的示例

  6. Javascript:傳播運算符 CheetSheet

  7. 學習編程很困難

  1. 在 GitHub 上獲得構建通過徽章✅!使用 Travis CI 測試您的 Express 應用程序

  2. Laravel yajra/Datatables 動作刪除不起作用

  3. mojo.js 1.0 - 從 Perl 到 Node.js

  4. 創建沒有 CRA 的反應應用程序(使用 vite)

  5. 使用 papaparse 忽略 csv 文件的標題

  6. 如何在 Blitz.js(Next.js) 中使用內聯 SVG

  7. 我準備好學習框架了嗎?

  1. 創建您的第一個 CSS 自定義屬性(變量)

  2. 破解盒子邀請代碼挑戰!是時候開始破解了。

  3. Show DEV:我建立了一個儀表板來跟踪我的生活

  4. 使用 Hapi 和 TypeScript 為 Jamstack 構建一個 Rest API