The JavaScript setHours date function is useful for setting the Hours, Minutes, Seconds, and Milliseconds of a given date as per local time.
The syntax of the setHours function is:
Date.setHours(Hours, Minutes, Seconds, Milliseconds)
Parameter: The syntax of the JavaScript setHours method accepts four parameters.
- Hours: It accepts the hours value ranging from 0 to 23 to pass it to the original date and time.
- Minutes(optional): It accepts a minute value range between 0 and 59.
- Seconds (optional): It accepts seconds values ranging between 0 and 59.
- Milliseconds (optional): It accepts milliseconds values, ranging between 0 and 999.
If you pass an hour value above 11 (for Example, 30), it considers 24 hours as one day and adds 1 day to the existing date, setting the remaining 6 as an hour value.
Return Value: The setHours() method returns a new and updated date with the given hours, minutes, seconds, and milliseconds. If the parameter value is NaN or undefined, the date becomes invalid, and the setHours() result is NaN.
JavaScript setHours example
In the following example, we use the setHours() method to set the hour value to 20 for the current time.
let dt = new Date();
console.log(dt);
dt.setHours(22);
console.log(dt);
Mon Jun 15 2026 10:54:59 GMT+0530 (India Standard Time)
Mon Jun 15 2026 22:54:59 GMT+0530 (India Standard Time)Example 2: In the code below, we use the Date() constructor to parse a string datetime and the JavaScript setHours() method to set the hour value to 15 of a custom date and time.
let dt = new Date("April 1, 2024 01:11:22");
console.log(dt);
dt.setHours(15);
console.log(dt);
Mon Apr 01 2024 01:11:22 GMT+0530 (India Standard Time)
Mon Apr 01 2024 15:11:22 GMT+0530 (India Standard Time)Example 3: In this JavaScript example, we use the Date() method to parse a date without a time. Next, apply the setHours() method on a date object without a time value. As we all know, by default, the time is set to 00:00:00, and the setHours() adds 10 to that value.
let dt = new Date("April 1, 2024");
console.log(dt);
dt.setHours(10);
console.log(dt);
Mon Apr 01 2024 00:00:00 GMT+0530 (India Standard Time)
Mon Apr 01 2024 10:00:00 GMT+0530 (India Standard Time)Example 4: As we mentioned earlier, in this JavaScript setHours function, the minutes, seconds, and Milliseconds arguments are optional. Let me use all four parameters in a single example.
NOTE: In JavaScript, to use minutes, an hours value is mandatory; to use seconds, minutes are required; and to use milliseconds, we must use seconds and milliseconds parameters.
let dt = new Date();
console.log(dt);
dt.setHours(23, 10, 40, 888);
console.log(dt);
console.log(dt.getHours());
console.log(dt.getMinutes());
console.log(dt.getSeconds());
console.log(dt.getMilliseconds());
Mon Jun 15 2026 11:03:31 GMT+0530 (India Standard Time)
Mon Jun 15 2026 23:10:40 GMT+0530 (India Standard Time)
23
10
40
888TIP: Please use the getHours(), getMinutes(), getSeconds, and getMilliseconds() methods to extract the hours, minutes, seconds, and milliseconds from the date object.
Example 5: As we mentioned earlier, if we pass an hour value greater than 23, it updates the date (day of the month) value based on the number of hours.
In the example below, we used the setHours() method with 50 Hours. Here, 50 hours means 2 Days and 2 hours. So, the setHours() method sets the current date and time ahead by 2 days and 2 hours. Here, the date becomes June 17 and the time is 02:06:22.
let dt = new Date();
console.log(dt);
dt.setHours(50);
console.log(dt);
Mon Jun 15 2026 11:06:22 GMT+0530 (India Standard Time)
Wed Jun 17 2026 02:06:22 GMT+0530 (India Standard Time)Example 6: Using JavaScript setHours() with negative hours
If we use the setHours() function with a negative hour value, it sets the time to the previous day’s last hour. If you observe the output, it shows the previous day’s date with 23rd hour as the output because it is the last hour of the previous day.
let dt = new Date();
console.log(dt);
dt.setHours(-1);
console.log(dt);
Mon Jun 15 2026 11:08:05 GMT+0530 (India Standard Time)
Sun Jun 14 2026 23:08:05 GMT+0530 (India Standard Time)How do I add or subtract hours using JavaScript setHours?
By combining the setHours() and getHours() methods, you can add or subtract several hours from a current date or a custom datetime.
In the following example, we will add two hours and subtract 7 hours from the current date and time.
let dt = new Date();
console.log(dt);
dt.setHours(dt.getHours() + 2);
console.log(dt);
dt.setHours(dt.getHours() - 7);
console.log(dt);
Mon Jun 15 2026 11:20:19 GMT+0530 (India Standard Time)
Mon Jun 15 2026 13:20:19 GMT+0530 (India Standard Time)
Mon Jun 15 2026 06:20:19 GMT+0530 (India Standard Time)Why does JavaScript setHours() return milliseconds instead of a date?
By default, the setHours() method modifies the original date and time. However, if we assign it to a new variable, it returns the date and time result of the setHours() method in milliseconds.
let dt = new Date();
console.log(dt);
let s = dt.setHours(20);
console.log(s);
console.log(dt);
Mon Jun 15 2026 11:23:09 GMT+0530 (India Standard Time)
1781535189964
Mon Jun 15 2026 20:23:09 GMT+0530 (India Standard Time)JavaScript set time to 23:59:59
We can use the setHours() method with 23, 59, 59, 9999 as the hours, minutes, seconds, and milliseconds values.
const dt = new Date();
dt.setHours(23, 59, 59, 999);
console.log(dt);
Mon Jun 15 2026 23:59:59 GMT+0530 (India Standard Time)JavaScript set time to 00:00:00
Use the setHours() method with hours, minutes, and seconds parameters with values of 0, 0, 0.
const dt = new Date();
dt.setHours(0, 0, 0);
console.log(dt);
Mon Jun 15 2026 00:00:00 GMT+0530 (India Standard Time)