Skip to content
Related Articles
Open in App
Not now

Related Articles

JavaScript Get the start and end of the day in UTC

Improve Article
Save Article
  • Last Updated : 27 Dec, 2022
Improve Article
Save Article

Given a date, the task is to determine the start and end of the day using javascript. We’re going to discuss a few techniques. First few methods to know.

  • JavaScript setHours() Method: This method sets the hour of a date object. This method can be used to set the minutes, seconds and milliseconds.

 Syntax:

Date.setHours(hour, min, sec, millisec)

Parameters:

  • hour: This parameter is required. It specifies the integer denoting the hours. Values accepted are 0-23, but other values are also allowed.
    -1 means the last hour of the previous day and 24 means the first hour of the next day.
  • min: This parameter is optional. It specifies the integer representing the minutes. Values accepted are 0-59, but other values are also allowed.
    60 means the first minute of next hour and -1 means the last minute of the previous hour.
  • sec: This parameter is optional. It specifies the integer representing the seconds. Values accepted are 0-59, but other values are also allowed.
    60 means the in the first second of next minute and -1 means the last second of previous minute.
  • millisec: This parameter is optional. It specifies the integer representing the milliseconds. Values accepted are 0-999, but other values are also allowed.
    • -1 means the last millisecond of previous second and 1000 means the first millisecond of next second.
  • JavaScript toUTCString() Method: This method converts a Date object to a string, depending on universal time.

 Syntax: 

Date.toUTCString()

Return Value: It returns a string, representing the UTC date and time as a string.

Example 1: This example gets the first millisecond of the day and last millisecond of the day as well using setHours() method and converting it to UTC format using stoUTCString() method.

HTML




<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        JavaScript
    | Get start and end of day in UTC.
    </title>
    <script src=
    </script>
</head>
  
<body style="text-align:center;"
    id="body">
    <h1 style="color:green;">
            GeeksForGeeks
        </h1>
    <p id="GFG_UP"
    style="font-size: 15px;
            font-weight: bold;">
    </p>
    <button onclick="GFG_Fun(); ">
        click here
    </button>
    <p id="GFG_DOWN"
    style="color: green;
            font-size: 24px;
            font-weight: bold;">
    </p>
    <script>
        var up = document.getElementById('GFG_UP');
        up.innerHTML =
        'Click on the button to get the'+
        ' start and end of the day in UTC';
          
        var down = document.getElementById('GFG_DOWN');
        var startOfDay = new Date();
        startOfDay.setHours(0, 0, 0, 0);
        var endofDay = new Date();
        endofDay.setHours(23, 59, 59, 999);
  
        function GFG_Fun() {
            down.innerHTML = startOfDay.toUTCString() +
            '<br>' + endofDay.toUTCString();
        }
    </script>
</body>
  
</html>

Output:

 

Example 2: This example gets the first millisecond of the day and last millisecond of the day but by a different approach than previous one using setHours() method and converting it to UTC format using stoUTCString() method.

HTML




<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        JavaScript
    | Get start and end of day in UTC.
    </title>
    <script src=
    </script>
</head>
  
<body style="text-align:center;"
    id="body">
    <h1 style="color:green;">
            GeeksForGeeks
        </h1>
    <p id="GFG_UP"
    style="font-size: 15px;
            font-weight: bold;">
    </p>
    <button onclick="GFG_Fun(); ">
        click here
    </button>
    <p id="GFG_DOWN"
    style="color: green;
            font-size: 24px;
            font-weight: bold;">
    </p>
    <script>
        var up = document.getElementById('GFG_UP');
        up.innerHTML =
        'Click on the button to get the start '+
        'and end of the day in UTC';
          
        var down = document.getElementById('GFG_DOWN');
        var startOfDay = new Date();
        startOfDay.setHours(0, 0, 0, 0);
        var endofDay = new Date();
        endofDay.setHours(24, 0, 0, -1);
  
        function GFG_Fun() {
            down.innerHTML = startOfDay.toUTCString() +
            '<br>' + endofDay.toUTCString();
        }
    </script>
</body>
  
</html>

Output:

 

We have a complete list of Javascript Date Objects, to check those please go through this Javascript Date Object Complete reference article.


My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!