Javascript Change Date Format

Introduction

To format a date string to another desired format, we build an utility function that helps us to convert a date to a another format. There are some javascript libraries that allow us to convert and format and change date format in javascript date string. We will use the Date object that represents the date and time in the form of a timestamp and then we will use various method to format date string on several ways.

Change Date Format Using Date() in JavaScript

Date() is a built in Javascript function that returns a formatted date string. The function new Date() when called returns the Date object and works like a constructor.

Syntax:

Let us consider a Javascript program to understand the use of Date()

Output:

Explanation: Here, the above Javascript function new Date() returns the Date object and we get the formatted string as day/ month(in string format) and year. Date() works like a constructor.

Change Date Format Using DateJS in JavaScript

DateJS is a library for Date provided by Javascript that is used to format, change date format in javascript,process and parse a string. To import Date.js include the .js file from the /build/ folder.

We use Date.parse to parse a string using DateJS in JAvascript.

Syntax:

Examples

Output:

Change Date Format yyyy-mm-dd hh:mm in JavaScript

The function described below converts a string in yyyy-mm-dd format to hh:mm format.

Explanation: The above JAvascript function stores the Date() in current date variable and converts it into a formatted date and returns the date in hh:mm format.

Convert dd/mm/yyyy to mm/dd/yyyy in JavaScript

The below mentioned javascript function converts dd/mm/yyy string format to mm/dd/yyyy format.

Explanation: The above function uses date.split("/") to format a dd/mm/yyyy to mm/dd/yyyy format.

Beautify Date yyyy-mm-dd hh:mm in Month Name and Day Name Format

Let us consider a Javascript function that converts a month number to month name format.

How to Change the Date Format in Vanilla JavaScript?

Let us understand how to change the Date Format using Vanilla Javascript.

Output:

Explanation: Here we use the dateFormat function consisting of two arguments- the input Date and the format to which the input Date is to be converted. The Date object is initialised when the source Date is passed as an argument to the constructor.

DateMethods like getMonth(), getDate() and getYear() are used to get the Date format components.

To format a month with a zero leading it's value, we use the method padStart .