Categories
28°C, New York
Home Javascript How to use the Native Approach In Javascript

How to use the Native Approach In Javascript

Using toLocaleString() Method

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”. 

Example: In this example, we are determining whether the given time belongs to AM or PM.

Javascript 
function changeTimeFormat() {
    let date = new Date();

    let hours = date.getHours();
    let minutes = date.getMinutes();

    // Check whether AM or PM
    let newformat = hours >= 12 ? 'PM' : 'AM';

    // Find current hour in AM-PM Format
    hours = hours % 12;

    // To display "0" as "12"
    hours = hours ? hours : 12;
    minutes = minutes < 10 ? '0' + minutes : minutes;

    console.log(hours + ':' + minutes + ' ' + newformat);
}

changeTimeFormat();

Output
5:34 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....

Tags:
#javascript-date #JavaScript-Questions #JavaScript #Web Technologies

Using toLocaleString() Method