How to Validate Email Addresses in JavaScript

A well-crafted regex that validates most of the email addresses.

Validating an email using JavaScript is not possible. The only 100% reliable way to validate an email address is by sending an email to the address to see if works.

That being said, you can use JavaScript and regular expression patterns (regex) to ‘validate’ most of the emails.

Just keep in mind you will never be able to write a regular expression that would be able to validate all the edge case email addresses like exceptionally long TLDs, or other domain-specific conventions that aren’t known.

Unfortunately, the best way to validate an email address is by sending an email to the address.

But concluding this way would be lame, wouldn’t it?

This guide teaches you the 2nd best way to validate emails, that is, how to do it with JavaScript + regex.

The 2nd Best Way to Validate Emails in JavaScript

Let’s take a look at how you can validate most of the email addresses using JavaScript.

To validate anything related to text, you can use regular expressions (regex).

A regular expression is like an advanced CTRL + F that allows you to not only search for words but patterns in text. With regex, you can write out patterns that capture phone numbers, names, and so on. One use case is to write a regular expression that matches valid email addresses.

⚠️ Unfortunately, unless you’re well-versed in regular expressions, you won’t understand anything about the following mess.

Here’s what the regex pattern for RFC 5322 official standard emails looks like. In other words, here’s a regular expression that you can use to validate most modern email addresses.

Source: regular-expressions.info

I’m not going to explain piece by piece how the above regular expression pattern works. This would make the 5-minute read a 30-minute read (or longer if you’re not familiar with regex).

But as a standalone expression, the above regex can’t do much. Instead, you need to place the regular expression inside JavaScript’s string.match() method for validating email strings.

For example, here’s a JavaScript validate() function that validates an email address string:

const validate = (email) => {
  return String(email)
    .toLowerCase()
    .match(/(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/);
};

Let’s use this function to check two emails:

if (validate("[email protected]")) {
    console.log("This email is valid")
} // Output: 'This email is valid'

if (validate("[email protected]@com")) {
    console.log("This email is valid")
} // No output - invalid email address

By the way, in case you’re interested in learning more about email formats and validation using regular expressions, make sure to read this detailed guide.

Also, if you heard the term Regex for the first time, feel free to stick around to learn a bit more about it! Knowing what regular expressions are will become useful in some parts of a software developer’s career.

What Is Regex?

Did you see the above regex mess for the first time? If you’re unfamiliar with regex or regular expressions, you might find it insightful to read this little primer to regex.

In a nutshell, regex (short for the regular expression) is a way to match patterns in text. In a sense, regex is CTRL + F on steroids. It not only matches with words but patterns, like emails, phone numbers, or such.

Regex is a powerful pattern-matching technique you can use to search, edit, and manipulate text. It’s commonly used in different types of software, including text editors, word processors, and programming languages.

A regex pattern is written using a combination of normal and special characters, and it is used to search for, and potentially replace, matching text in a larger body of text.

For example, the regular expression \d+ searches for digits in the text.

This is an example of a really simple regular expression.

But the power of regex stems from its extensibility. You can combine the basic operators to form unbelievably long chains of expressions that for example find phone numbers in a text document.

Another really useful thing about regex is that most programming languages support it natively.

In JavaScript, you can use regular expressions to do pattern matching which can be useful when doing form validations or searching for patterns in other types of data you might have on your applications.

Testing the Regex

If you’re new to regex, make sure to start using regex online editors as early as possible. They offer a huge time saver when working with custom regular expressions.

For instance, you can try the power of the email-validating regular expression here:

As you can see, the regex captures all the valid-looking email addresses. Just remember, it’s not perfect. Regex can never handle corner cases of emails.

Summary

Today you learned how to validate emails using JavaScript and why it’s impossible to do it 100% reliably.

If you want to validate emails with JavaScript, you need to use a lengthy regular expression that matches the most common variations of email addresses.

Be careful to thoroughly test the regex scripts you find. Domains and email address formats change, so a regex that worked 3 years ago might no longer work…

The key takeaway for validating email with JavaScript is to not just copy a random regex from the internet. Instead, it requires thorough testing and accepting the fact that no regex is able to validate all the emails out there.

Thanks for reading. Happy coding!

Read Also

Full Guide to Regex

About the Author

Artturi Jalli
I'm an entrepreneur and a blogger from Finland. My goal is to make coding and tech easier for you with comprehensive guides and reviews.