How to Validate a Date in JavaScript

# Table of Contents

1. Check if a Date is valid using JavaScript
2. Check if a Date is valid using Object.toString()
3. Check if a Date is valid using duck-typing
4. Validate a Date formatted as YYYY-MM-DD in JavaScript
5. Validate a Date formatted as DD/MM/YYYY in JavaScript

# Check if a Date is valid using JavaScript

To check if a date is valid:

1. Check if the date is an instance of the Date object.
2. Check if passing the date to the isNaN() function returns false.
3. If both conditions are met, the date is valid.

Copied!
function dateIsValid(date) {
  return date instanceof Date && !isNaN(date);
}

console.log(dateIsValid(new Date('2022-03-36'))); // 👉️ false
console.log(dateIsValid(new Date())); // 👉️ true
console.log(dateIsValid(new Date('2022-03-24'))); // 👉️ true

We created a reusable function that takes a Date object as a parameter and checks if the date is valid.

The instanceof operator returns a boolean value indicating whether the prototype property of the constructor appears in the prototype chain of the object.

Copied!
console.log(new Date() instanceof Date); // 👉️ true
console.log({} instanceof Date); // 👉️ false
console.log([] instanceof Date); // 👉️ false
console.log('hi' instanceof Date); // 👉️ false

The instanceof operator will only return true if the value to the left was created using the Date() constructor or a class that extends it.

The second condition checks if passing the date to the isNaN() function returns false.

Copied!
function dateIsValid(date) {
  return date instanceof Date && !isNaN(date);
}

The isNaN function takes a value and tries to determine if the value is NaN (not a number).

When you convert a valid date to a number, you get a timestamp - the number of milliseconds elapsed between the 1st of January and the given date.

Copied!
// 👇️ 1643112264226
console.log(Number(new Date()));

// 👇️ NaN
console.log(Number(new Date('2022-03-36')));

In the second example we passed an invalid date to the Date constructor, so converting the value to a number returning NaN.

It should be noted that the instanceof operator wouldn't work if the Date object is created in another context, e.g. in an external iframe.

# Check if a Date is valid using Object.toString()

If you are creating the Date object in an external window or an iframe, stringify the object's prototype instead of using the instanceof operator.

Copied!
function dateIsValid(date) {
  return (
    Object.prototype.toString.call(date) === '[object Date]' &&
    !isNaN(date)
  );
}

console.log(dateIsValid(new Date('2022-03-36'))); // 👉️ false
console.log(dateIsValid(new Date())); // 👉️ true
console.log(dateIsValid(new Date('2022-03-24'))); // 👉️ true

The code snippet above should only be used if you are creating your Date objects in an external window, e.g. an iframe.

In all other cases, the instanceof operator gets the job done and is much more readable.

# Check if a Date is valid using duck-typing

Alternatively, you can use duck-typing.

Copied!
function dateIsValid(date) {
  if (
    typeof date === 'object' &&
    date !== null &&
    typeof date.getTime === 'function' &&
    !isNaN(date)
  ) {
    return true;
  }

  return false;
}

console.log(dateIsValid(new Date('2022-03-36'))); // 👉️ false
console.log(dateIsValid(new Date())); // 👉️ true
console.log(dateIsValid(new Date('2022-03-24'))); // 👉️ true
console.log(dateIsValid([])); // 👉️ true
console.log(dateIsValid({})); // 👉️ true
console.log(dateIsValid(null)); // 👉️ true

We first check if the passed-in value has a type of object.

Since null also has a type of object in JavaScript, we have to explicitly check that the value is not null.

Then, we check if the object has a getTime property that is a function. You could repeat this process with any other properties or methods that the Date object implements.

# Validate a Date formatted as YYYY-MM-DD in JavaScript

To validate a date that is formatted as YYYY-MM-DD:

1. Check if the string passes a regular expression check.
2. Check if passing the string to the Date constructor returns a valid Date object.
3. If both conditions are met, the string is formatted as YYYY-MM-DD.

Copied!
function dateIsValid(dateStr) {
  const regex = /^\d{4}-\d{2}-\d{2}$/;

  if (dateStr.match(regex) === null) {
    return false;
  }

  const date = new Date(dateStr);

  const timestamp = date.getTime();

  if (typeof timestamp !== 'number' || Number.isNaN(timestamp)) {
    return false;
  }

  return date.toISOString().startsWith(dateStr);
}

console.log(dateIsValid('2022-01-24')); // 👉️ true
console.log(dateIsValid('2022-01-35')); // 👉️ false
console.log(dateIsValid('hello')); // 👉️ false

We created a reusable function that checks if a string is a valid date, formatted as YYYY-MM-DD.

The function takes a string in the form of YYYY-MM-DD as a parameter.

The regex variable stores a regular expression.

The forward slashes / / mark the beginning and end of the regex.

The \d special character matches any digit in the range of 0 to 9. Specifying the \d character is the same as specifying a range of [0-9].

The number in the curly braces {} is an exact match of the number of digits we expect between the hyphens.

If you ever need help reading a regular expression, check out this regex cheat sheet from MDN.

The String.match() method returns an array containing the matches of the regular expression in the string or null if no matches are found.

The next step is to pass the date string to the Date() constructor to see if we get a valid Date object back.

Here is an example of the flow for when an invalid date that passes the regex is supplied to the dateIsValid function.

Copied!
function dateIsValid(dateStr) {
  const regex = /^\d{4}-\d{2}-\d{2}$/;

  if (dateStr.match(regex) === null) {
    return false;
  }

  const date = new Date(dateStr);
  console.log(date); // 👉️ Invalid Date

  const timestamp = date.getTime();
  console.log(timestamp); // 👉️ NaN

  if (typeof timestamp !== 'number' || Number.isNaN(timestamp)) {
    // 👇️ this runs
    return false;
  }

  return date.toISOString().startsWith(dateStr);
}

console.log(dateIsValid('2022-01-35')); // 👉️ false

The date variable stores an Invalid Date object.

Calling the getTime() method on the Invalid Date object returns NaN (not a number).

The getTime() method returns a number that represents the milliseconds between the 1st of January, 1970 and the given date.

In our if condition, we check if the timestamp variable doesn't store a number or stores NaN.

Unfortunately, if you console.log(typeof NaN), you will get "number" back.

The toISOString() method returns a string formatted as YYYY-MM-DDTHH:mm:ss.sssZ.

If the ISO representation of the Date object starts with the provided string, we can conclude that the date string is valid and formatted as YYYY-MM-DD.

# Validate a Date formatted as DD/MM/YYYY in JavaScript

To validate a date that is formatted as DD/MM/YYYY:

1. Check if the string passes a regular expression check.
2. Check if formatting the string as ISO and passing it to the Date constructor returns a valid Date object.
3. If all of the conditions are met, the string is formatted correctly.

Copied!
// ✅ Validate date formatted as `DD/MM/YYYY`
function dateIsValid(dateStr) {
  const regex = /^\d{2}\/\d{2}\/\d{4}$/;

  if (dateStr.match(regex) === null) {
    return false;
  }

  const [day, month, year] = dateStr.split('/');

  // 👇️ format Date string as `yyyy-mm-dd`
  const isoFormattedStr = `${year}-${month}-${day}`;

  const date = new Date(isoFormattedStr);

  const timestamp = date.getTime();

  if (typeof timestamp !== 'number' || Number.isNaN(timestamp)) {
    return false;
  }

  return date.toISOString().startsWith(isoFormattedStr);
}

console.log(dateIsValid('18/01/2022')); // 👉️ true
console.log(dateIsValid('35/01/2022')); // 👉️ false
console.log(dateIsValid('hello')); // 👉️ false

We created a reusable function that checks if a string is a valid date formatted as DD/MM/YYYY.

The function takes a string in the form of DD/MM/YYYY as a parameter.

You can use the same approach if you need to validate a date that is formatted as MM/DD/YYYY.

You just have to change the order of destructuring when splitting on the forwards slash /.

Copied!
// ✅ Validate date formatted as `MM/DD/YYYY`
function dateIsValid(dateStr) {
  const regex = /^\d{2}\/\d{2}\/\d{4}$/;

  if (dateStr.match(regex) === null) {
    return false;
  }

  // 👇️ only changed the order of destructuring assignment
  const [month, day, year] = dateStr.split('/');

  // 👇️ format Date string as `yyyy-mm-dd`
  const isoFormattedStr = `${year}-${month}-${day}`;

  const date = new Date(isoFormattedStr);

  const timestamp = date.getTime();

  if (typeof timestamp !== 'number' || Number.isNaN(timestamp)) {
    return false;
  }

  return date.toISOString().startsWith(isoFormattedStr);
}

console.log(dateIsValid('01/18/2022')); // 👉️ true
console.log(dateIsValid('01/35/2022')); // 👉️ false
console.log(dateIsValid('hello')); // 👉️ false

The regex variable stores a regular expression.

The forward slashes / / mark the beginning and end of the regular expression.

The \d special character matches any digit in the range of 0 to 9. Specifying the \d character is the same as specifying a range of [0-9].

The number in the curly braces {} is an exact match of the number of digits we expect between the forward slashes.

If you ever need help reading a regular expression, check out this regex cheat sheet from MDN.

The String.match() method returns an array containing the matches of the regular expression in the string or null if no matches are found.

The next step is to get a string, formatted as YYYY-MM-DD and pass it to the Date() constructor to see if we get a valid Date object back.

Here is an example of the flow where an invalid date that passes the regex is supplied to the dateIsValid function.

Copied!
function dateIsValid(dateStr) {
  const regex = /^\d{2}\/\d{2}\/\d{4}$/;

  if (dateStr.match(regex) === null) {
    return false;
  }

  const [day, month, year] = dateStr.split('/');

  // 👇️ format Date string as `yyyy-mm-dd`
  const isoFormattedStr = `${year}-${month}-${day}`;

  const date = new Date(isoFormattedStr);
  console.log(date); // 👉️ Invalid Date

  const timestamp = date.getTime();
  console.log(timestamp); // 👉️ NaN

  if (typeof timestamp !== 'number' || Number.isNaN(timestamp)) {
    // 👇️ this runs
    return false;
  }

  return date.toISOString().startsWith(isoFormattedStr);
}

console.log(dateIsValid('35/01/2022')); // 👉️ false

The date variable stores an Invalid Date object.

Calling the getTime() method on the Invalid Date object returns NaN (not a number).

The getTime() method returns a number that represents the milliseconds between the 1st of January 1970 and the given date.

In our if condition, we check if the timestamp variable doesn't store a number or stores NaN.

Unfortunately, if you console.log(typeof NaN), we get back a "number" value back.

The toISOString() method returns a string formatted as YYYY-MM-DDTHH:mm:ss.sssZ.

If the ISO representation of the Date object starts with the provided string, then the date string is valid and formatted as DD/MM/YYYY.