Skip to main content

How to Compare Two Time Strings (HH:MM:SS) in JavaScript

A common task in programming is to compare two time values that are represented as strings, for example, to check if one time is later than another. If your time strings are in a consistent, zero-padded 24-hour format (HH:MM:SS), there are several effective ways to perform this comparison.

This guide will teach you three methods for comparing HH:MM:SS time strings. We will cover the simple but fragile direct string comparison, the robust but verbose Date object method, and a balanced numerical approach that is often the best choice.

The Core Problem: Why Direct new Date() is Unreliable​

Your first instinct might be to pass the time string directly to the Date constructor. This is not reliable and should be avoided.

// Problem: This seems easy, but its behavior is inconsistent.
const date1 = new Date('09:00:00');
const date2 = new Date('10:00:00');

// This might work in some browsers but will return `Invalid Date` in others.
console.log(date1 < date2);

The new Date() constructor's parsing of time-only strings is not standardized across all browsers. To compare times reliably, you must use a more explicit method.

Method 1: Direct String Comparison (Simple but Fragile)​

If—and only if—your time strings are always zero-padded and in 24-hour format (HH:MM:SS), you can compare them directly as strings.

const time1 = '09:30:00';
const time2 = '14:15:00';

if (time1 < time2) {
  console.log(`${time1} is earlier than ${time2}`);
} else {
  console.log(`${time1} is not earlier than ${time2}`);
}

Output:

09:30:00 is earlier than 14:15:00

How Method 1 Works (and When It Fails)​

This works because of lexicographical (dictionary) comparison. JavaScript compares the strings character by character from left to right. Since 0 comes before 1 in the character set, '09:...' is correctly identified as being "less than" '14:...'.

This method will fail if the strings are not zero-padded:

'9:30:00' > '14:15:00' // This is TRUE, which is wrong!
// (Because the first character '9' is greater than '1')

Because of this fragility, this method should only be used when you have absolute control over the input format.

Method 2: Creating Date Objects (Robust but Verbose)​

A very robust method is to parse the time strings and create Date objects with a common, arbitrary date. This allows you to use JavaScript's reliable date comparison.

function compareTimes(time1, time2) {
  const [h1, m1, s1] = time1.split(':');
  const [h2, m2, s2] = time2.split(':');

  // Use the same arbitrary date for both
  const date1 = new Date(2023, 0, 1, h1, m1, s1);
  const date2 = new Date(2023, 0, 1, h2, m2, s2);

  if (date1 < date2) return -1; // time1 is earlier
  if (date1 > date2) return 1;  // time1 is later
  return 0; // times are equal
}

// Example Usage:
console.log(compareTimes('09:30:00', '14:15:00')); // Output: -1

This method offers the best balance of reliability and performance. By converting each time string into a single numerical value (like total seconds since midnight), you get a simple and robust integer comparison.

The logic:

  1. Split the HH:MM:SS string into its hour, minute, and second components.
  2. Calculate the total number of seconds for each time: (hours * 3600) + (minutes * 60) + seconds.
  3. Compare the two resulting numbers.

Solution:

function timeToSeconds(time) {
  const [hours, minutes, seconds] = time.split(':').map(Number);
  return (hours * 3600) + (minutes * 60) + seconds;
}

const time1 = '09:30:00';
const time2 = '14:15:00';

const seconds1 = timeToSeconds(time1); // 34200
const seconds2 = timeToSeconds(time2); // 51300

if (seconds1 < seconds2) {
  console.log(`${time1} is earlier than ${time2}`);
}

Output:

09:30:00 is earlier than 14:15:00
note

This method is explicit, avoids the overhead of creating Date objects, and works correctly even if the strings are not zero-padded (e.g., '9:30:0').

Practical Example: Checking if a Time is Within a Range​

A common use case is to check if the current time falls within a specific range, like business hours.

function isTimeInRange(time, startTime, endTime) {
  const timeInSeconds = timeToSeconds(time);
  const startInSeconds = timeToSeconds(startTime);
  const endInSeconds = timeToSeconds(endTime);

  return timeInSeconds >= startInSeconds && timeInSeconds <= endInSeconds;
}

// Helper function from above
function timeToSeconds(time) {
  const [hours, minutes, seconds] = time.split(':').map(Number);
  return (hours * 3600) + (minutes * 60) + seconds;
}

// Get the current time in HH:MM:SS format
const now = new Date();
const currentTime = now.toLocaleTimeString('en-GB'); // 'en-GB' provides the 24-hour format

console.log(`Current time is ${currentTime}`);
const inBusinessHours = isTimeInRange(currentTime, '09:00:00', '17:00:00');

console.log('Is it currently business hours?', inBusinessHours);

Conclusion​

While there are several ways to compare HH:MM:SS time strings in JavaScript, they are not all equally reliable.

  • Direct string comparison is simple but fragile and should only be used if you can guarantee perfect, zero-padded, 24-hour formatting.
  • Creating Date objects is very robust but can be verbose for a simple time comparison.
  • Converting each time to a total number of seconds is the recommended best practice. It offers the reliability of a numerical comparison without the overhead of Date objects, and it handles format variations gracefully.

Table of Contents