How to use Intl.DateTimeFormat In Javascript

The Intl.DateTimeFormat object enables language-sensitive date and time formatting. By specifying the appropriate options, we can easily convert the time to a 12-hour format with AM/PM notation.

Example: Implementing the third approach

JavaScript
function changeTimeFormat() {
    let date = new Date();
    
    let formatter = new Intl.DateTimeFormat('en-US', {
        hour: '2-digit',
        minute: '2-digit',
        hour12: true
    });
    
    let formattedTime = formatter.format(date);
    
    console.log(formattedTime);
}

changeTimeFormat();

Output
03:54 AM


How do you display JavaScript datetime in 12 hour AM/PM format ?

JavaScript uses the 24-hour format as the default for DateTime. However, daytime in JavaScript can be displayed in 12-hour AM/PM format using several approaches.

There are two approaches that will be discussed below:

Table of Content

  • Using the Native Approach
  • Using toLocaleString() Method
  • Using Intl.DateTimeFormat

Similar Reads

Using the Native Approach

In this approach, we will change the DateTime format by only using native methods. Simply put, we will apply the modulo “%” operator to find the hour in 12-hour format and use the conditional “?:” operator to apply “AM” or “PM”....

Using toLocaleString() Method

In this approach, we will utilize an inbuilt method toLocaleString() to change the format of the given date into AM-PM format. toLocaleString() Method returns a string representation of the date Object. The 2 arguments Locale and options allow for customization of the behavior of the method....

Using Intl.DateTimeFormat

The Intl.DateTimeFormat object enables language-sensitive date and time formatting. By specifying the appropriate options, we can easily convert the time to a 12-hour format with AM/PM notation....

Contact Us