Best Way To Validate Email In Javascript

Best Way To Validate Email In Javascript

Javascript is one of the most trending programming language these days. Be it frontend development or backend development, Javascript used widely in almost every field of web development.

While the development of any websites or applications using the Javascript, we have to create a contact form, signup form, sign in form, or any other type of forms where we need users’ email.

It is very important to validate the input fields before doing any further action on this. And email validation is a must to do thing in any type of form building.

Here, we are not going to debate about what is the email and which one is a valid or invalid email.

So without wasting any further time, let’s see how to validate email in Javascript.

Different Methods To validate Email In Javascript

There are many ways to validate the email depending upon the requirement.

  • Using the regex expression
  • Using any third party library
  • Using HTML in-built email validation property

Here, we are going to use the simple regex expression for validating the email.

Rules That Email Validation Should Follow

Before writing the regex, we first know what is the basic rule that email validation should follow?

Mainly an email address consists of two-part, local part and domain part.

The local-part contains the following thing

  • any alphanumeric character: a-zA-Z0-9
  • a dot ((.), if it’s not the first or last character
  • punctuation: “(),:;<>@[\]
  • special characters: !#$%&’*+-/=?^_{|}~

And the domain part contains the following

  • any alphanumeric character: a-zA-Z0-9
  • the hyphen (-), if it’s not the first or last character. It can be repeated

Regular Expression To Validate Email In Javascript

There is no universal regular expression to validate email, Everyone is using a different set of regex in their code to validate the email.

Before using any regex in your code, you first validate it by trying on so some valid and invalid email address.

/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/

Above is the regex which can validate the 99.9% of the email address.

I know, it is not the simple regex to understand. Some regex expert writes this and it spread all over the internet now.

You can check this regex by trying any online regular expression testing tool. For my testing, I prefer to use regexr website.

Javascript Code To Validate Email

const validateEmail = (email)  => {
    const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(email.toLowerCase());
}

Above is the simple javascript arrow function which is used to validate any email. Code is very simple to understand, here we use the regular expression to compare it with the provided email id after converting it into the lowercase.

Conclusion

This is all above the validation email in javascript using the regex. Although the regex which is used in this article is not easy to understand in the first go.

Note : If you have any doubts or suggestion then do comment in the comment box and if you like this article then share it.

Leave a Comment