Wednesday, July 11, 2018

momentjs javascript date library tutorials

javascript Date momentJS parsing basics

 Momentjs is an opensource JavaScript library for manipulating and parsing date objects.  Every developer needs to know how to manipulate date and time during their project development.
JavaScript has a date object, Developer must write a lot of code to manipulate date and time object and don’t have flexibilities to parse and validate the object. There are a lot of date and time libraries in JavaScript. MomentJS is one of the popular library  in javascript applications.
Moments library can be used in normal web-based JavaScript/jQuery application as well as NodeJS/typescript applications. We can configure momentjs in different ways as follows

Usage of  momentjs in script tag of  HTML

The most recent  library can be downloaded from momentjs official website or you can use  momentjs cdn url URL in script tags

    <script src="pathto/moment.js"></script>

Using npm package in nodejs environment

this has npm package for nodejs applications. We can use node package manager command to install project dependencies

npm install moment

Configure momentjs in typescript applications

first, you must install moment js library using npm command
In the typescript code, use below code as like this

 import * as moment from moment
let now = moment();

Moving to the next section, We will see various  momentjs examples 

How to get Current Date and time in javascript using momentJS

Moment object has an empty constructor which gives current date and time


      <title>Moment.js Example Current Date and time</title>
      <H1> javascript example for Current Date and Time </H1>
      <div id="showCurrentDateMomentJs"></div>
      <script src=""></script>
      <script src="lib/moment.js"></script>
         var CurrentDateAndTime = document.getElementById('showCurrentDateMomentJs');
         var CurrentDateAndTimeMoment = moment();

And the output is Thu Jul 05 2018 12:08:47 GMT+0530

MomentJs Format examples

using the Format method, we can do format the date to various formats and also can validate the date.

MomentJS format date examples

The following code returns the date in various formats

moment().format() - 018-07-11T12:04:35+05:30
moment().format('dd')- Wed
moment().format("MMM Do YYYY") - Jul 11th 2018

format date time string example

during string format, any characters like hypen (-) or slash (/) will not considered

moment(''01-12-2018').format('MM/DD/YYY') - 01-12-2018

Date valid check using format

moments format method used to check passed value is in date format or not using the isValid method

var m = moment("2018-20-08",'YYYY-DD-MM');
m.isValid()  returns true
var m1 = moment("20-08-2018");
 m1.isValid() returns false

How to convert UTC time to local time using momentJS javascript

To enable timezone capabilities, need to add momentJS timezone library


 moment.utc().format('YYYY-MM-DD HH:mm:ss')
UTC time is  2018-07-10 16:06:39
  //below code  convert UTC to local timezone  
    var currentLocalTime  = moment.utc('2018-07-10 16:06:39').toDate();
    localTimeFromUTC = moment(currentLocalTime).format('YYYY-MM-DD HH:mm:ss');

Your Local Time related to UTC as mentioned above 2018-07-10 21:36:39

Related article