• JavaScript Video Tutorials

JavaScript - Get Date Methods



Get Date Methods

JavaScript utilizes the Date object for date and time manipulation. This object offers an array of methods that facilitate retrieval and modification of date-specific information. Here, we will discuss about the get date methods within JavaScript which fetch different components of the date/time.

Below is a table of the most commonly used get date methods and their corresponding description.

Method Description
getFullYear() This method fetches and presents the comprehensive calendar year by retrieving the current year in local time zone; it returns the full four-digit representation of a local date object.
getMonth() Returns the month (0-11) of the local date object. This method retrieves the current month, with values ranging from 0 (January) to 11 (December). It's useful for displaying and manipulating month-related information.
getDate() The method: 'returns the day component of the current date', a value ranging from 1 to 31. This functionality proves particularly useful when one needs this information extracted from a local date object.
getHours() The function 'getHours()' extracts and returns the local date object's hour component (0-23). This allows you to retrieve the current hour in your local time zone for a variety of time-related applications.
getMinutes() Returns the minutes (0-59) of the local date object. Retrieves the current minute component, ranging from 0 to 59. Useful for displaying and handling time-related data at the minute level.
getSeconds() This returns the seconds ranging from 0 to 59 of the local date object. It provides precision down the seconds for a variety of time-based calculations/displays.
getMilliseconds() Returns the milliseconds (0-999) of the local date object. Retrieves the current millisecond component, allowing for high precision in time-related applications and calculations.
getDay() Returns the index of day of the week starting from 0 which stands for Sunday, all the way up to 6 for Saturday.
getUTCFullYear() Returns the full 4-digit year of the date object in Coordinated Universal Time (UTC). This method retrieves the current year in UTC, providing a standardized representation of the calendar year irrespective of the local time zone.
getUTCMonth() Returns the index of the month ranging from 0(Jan) to 11(Dec) but of the date object in Coordinated Universal Time (UTC).
getUTCDate() Returns the day of the month (1-31) of the date object in Coordinated Universal Time (UTC). Useful for obtaining the day component of the current date in a UTC context.
getUTCHours() Returns the hour (0-23) of the date object in Coordinated Universal Time (UTC). Retrieves the current hour in UTC, allowing for standardized access to the hour component across different time zones.
getUTCMinutes() Returns the minutes (0-59) of the date object in Coordinated Universal Time (UTC). Retrieves the current minute component in UTC, providing standardized minute information for various international time-based applications.
getUTCSeconds() The function fetches the seconds (ranging from 0 to 59) of a date object in Coordinated Universal Time (UTC). It also acquires the current second component in UTC, thereby enabling standardized second information across various time zones.
getUTCMilliseconds() The function returns the milliseconds (0-999) of the date object in Coordinated Universal Time (UTC); it retrieves and offers high precision for standardized time-related calculations and applications: specifically, it provides the current millisecond component in UTC.

Examples

Example 1: Simple demonstration of get date methods

The following example demonstrates the fundamental application of prevalent JavaScript date methods: It instantiates a novel Date object to represent the present date and time; subsequently, it exhibits an array of diverse components - year, month, day; hours, minutes, seconds, milliseconds; along with their corresponding UTC counterparts. The displayed elements encompass not only standard temporal divisions but also supplementary information about weekdays: thus providing comprehensive insight into current temporal dynamics.

<!DOCTYPE html>
<html>
<head>
   <title> Exxample to demonstrate get date methods in JavaScript</title>
</head>
<body>
   <script>
      // Create a new Date object
      const currentDate = new Date();

      function displayResult(methodName, result) {
         const resultDiv = document.createElement('div');
         resultDiv.innerHTML = `${methodName}: ${result}`;
         document.body.appendChild(resultDiv);
      }

      displayResult('getFullYear()', currentDate.getFullYear());
      displayResult('getMonth()', currentDate.getMonth());
      displayResult('getDate()', currentDate.getDate());
      displayResult('getHours()', currentDate.getHours());
      displayResult('getMinutes()', currentDate.getMinutes());
      displayResult('getSeconds()', currentDate.getSeconds());
      displayResult('getMilliseconds()', currentDate.getMilliseconds());
      displayResult('getDay()', currentDate.getDay());
      displayResult('getUTCFullYear()', currentDate.getUTCFullYear());
      displayResult('getUTCMonth()', currentDate.getUTCMonth());
      displayResult('getUTCDate()', currentDate.getUTCDate());
      displayResult('getUTCHours()', currentDate.getUTCHours());
      displayResult('getUTCMinutes()', currentDate.getUTCMinutes());
      displayResult('getUTCSeconds()', currentDate.getUTCSeconds());
      displayResult('getUTCMilliseconds()', currentDate.getUTCMilliseconds());
   </script>
</body>
</html>

Example 2: Comparison of two dates

In this example, the Date constructor creates two specific dates: date1 and date2. The script subsequently compares these dates; it displays their formatted representations, along with a message indicating if date1 is later, earlier or equal to date2.

<!DOCTYPE html>
<html>
<head>
   <title>Comparison of two dates in JavaScript</title>
</head>
<body>
   <script>
      const date1 = new Date(2024, 0, 18);
      const date2 = new Date(2024, 0, 26);

      function displayComparison() {
         const date1Div = document.createElement('div');
         date1Div.innerHTML = `Date 1: ${date1.toDateString()}`;
         document.body.appendChild(date1Div);

         const date2Div = document.createElement('div');
         date2Div.innerHTML = `Date 2: ${date2.toDateString()}`;
         document.body.appendChild(date2Div);

         const resultDiv = document.createElement('div');
         if (date1 > date2) {
            resultDiv.innerHTML = "date 1 is later than date 2";
         } else if (date1 < date2) {
            resultDiv.innerHTML = "date 1 is earlier than date 2";
         } else {
            resultDiv.innerHTML = "Both dates are equal";
         }
         document.body.appendChild(resultDiv);
      }

      displayComparison();
   </script>
</body>
</html>
Advertisements