Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

JavaScript Date setHours() Method

  • Last Updated : 26 Oct, 2021

Below is the example of Date setHours() method.

Hey geek! The constant emerging technologies in the world of web development always keeps the excitement for this subject through the roof. But before you tackle the big projects, we suggest you start by learning the basics. Kickstart your web development journey by learning JS concepts with our JavaScript Course. Now at it's lowest price ever!

  • Example:




    <script>
       // Here a date has been assigned
       // while creating Date object
       var dateobj = 
       new Date('October 13, 1996 05:35:32');
      
       // New hour 11 is being set in above Date
       // Object with the help of setHours() method
       dateobj.setHours(11);
      
       // New hour from above Date Object is
       // being extracted using getHours()
       var B = dateobj.getHours();
      
       // Printing new hour
       document.write(B);
    </script>
  • Output:
    11

The date.setHours() method is used to set hours into a date object which is created using the Date() constructor.

Syntax:

DateObj.setHours(hours_Value)

Parameter: This method accept a single parameter as mentioned above and described below:



  • hours_Value: This parameters holds the value of hour which is used to set in Date() constructor.

Return Value: It returns the new date with updated hour which is set by setHours() method.

Note: The DateObj is a valid Date object created using Date() constructor in which we want to set the hours.

More codes for the above method are as follows:

Program 1: If in Date() constructor we do not give hour while creating the Date object, still setHours() method will set the new hour which is given as its parameter.




<script>
   // Here hour has not been assigned
   // while creating Date object
   var dateobj = new Date('October 13, 1996');
  
   // New hour 11 is being set in above Date
   // Object with the help of setHours() method
   dateobj.setHours(11);
  
   // New hour from above Date Object is
   // being extracted using getHours()
   var B = dateobj.getHours();
  
   // Printing new hour
   document.write(B);
</script>

Output:

11

Example 2: If nothing as a parameter is given in the Date() constructor, still setHours() method set hour but a month, year and date will be a current month, year, and date. Here 11 is the new hour, 2 is the current month i.e March, 30 is the current date and 2018 is the current year.




<script>
   // Here nothing has been assigned
   // while creating Date object
   var dateobj = new Date();
  
   // new hour 11 is being set in above Date
   // Object with the help of setHours() method
   dateobj.setHours(11);
  
   // Hour from above Date Object is
   // being extracted using getHours()
   var B = dateobj.getHours();
  
   // Month from above Date Object is
   // being extracted using getMonth()
   var C = dateobj.getMonth();
  
   // Date from above Date Object is
   // being extracted using getDate()
   var D = dateobj.getDate();
  
   // Year from above Date Object is
   // being extracted using getFullYear()
   var E = dateobj.getFullYear();
  
   // Printing new Hour
   document.write(B + "<br />");
  
   // Printing current month
   document.write(C + "<br />");
  
   // Printing current date
   document.write(D + "<br />");
  
   // Printing current year
   document.write(E);
</script>

Output:

11
2
30
2018

Example 3: If value of hour as 26 is given in the parameter of setHours() method, It will set 2 as the hour because hour range is form 0 to 23 and 26%24=2.

Here 2 is the new hour, 9 is the month i.e October, 14 is the date and year is 1996. Here as we see that 13 was the original date but output becomes 14 because 26 hours given as the parameter of the method converted to 2 hours of next day that is why date incremented by 1 i.e, from 13 to 14.




<script>
   // Here nothing has been assigned
   // while creating Date object
   var dateobj = 
   new Date('October 13, 1996 05:35:32');
  
   // New hour 26 is being set in above Date
   // Object with the help of setHours() method
   dateobj.setHours(26);
  
   // Hour from above Date Object is
   // being extracted using getHours()
   var B = dateobj.getHours();
  
   // Month from above Date Object is
   // being extracted using getMonth()
   var C = dateobj.getMonth();
  
   // Date from above Date Object is
   // being extracted using getDate()
   var D = dateobj.getDate();
  
   // Year from above Date Object is
   // being extracted using getFullYear()
   var E = dateobj.getFullYear();
  
   // Printing new Hour
   document.write(B + "<br />");
  
   // Printing month
   document.write(C + "<br />");
  
   // Printing date
   document.write(D + "<br />");
  
   // Printing year
   document.write(E);
</script>

Output:

2
9
14
1996

Supported Browsers: The browsers supported by JavaScript Date setHours() method are listed below:

  • Google Chrome 1 and above
  • Edge 12 and above
  • Firefox 1 and above
  • Internet Explorer 3 and above
  • Opera 3 and above
  • Safari 1 and above



My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!