How do you check for valid email input?

I’m working with strings in section 9 of The Complete JavaScript Course 2023: From Zero to Expert, which I purchased on Udemy.

Jonas Schmedtmann, one of Udemy’s Top Instructors, demonstrates how to check the validity of email input using various meth…


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by Bo Louie

I'm working with strings in section 9 of The Complete JavaScript Course 2023: From Zero to Expert, which I purchased on Udemy.

Jonas Schmedtmann, one of Udemy's Top Instructors, demonstrates how to check the validity of email input using various methods on strings (shown in CodeSnap below).

![A CodeSnap of JavaScript string methods for converting to lowercase and getting rid of white spaces]](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mta0cxlfexunswr33de9.png)

Jonas mentioned the challenge of creating a function with checking or validating behaviour, that could return a boolean. I took on the challenge and generated three functions by prompting ChatGPT, as outlined below.

1st Function

Use a regular expression to check if the email is in the correct format


function isValidEmail(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(String(email).toLowerCase());
}

This function takes an email as an argument and uses a regular expression to check if the email is in the correct format. The regular expression checks for the presence of an @ symbol and a ., and it also checks that the email does not contain any invalid characters.

2nd Function

To use this function, you can pass the email that you received as an input to the function and check if it is valid:

const email = 'Hello@Jonas.Io';

if (isValidEmail(email)) {
  console.log('Valid email');
} else {
  console.log('Invalid email');
}

This code will output Valid email, because the email is in the correct format.

3rd Function

To fix the capitalization and remove the spaces before and after the email, you can use the trim and toLowerCase methods:

const fixedEmail = email.trim().toLowerCase();

if (isValidEmail(fixedEmail)) {
  console.log('Valid email');
} else {
  console.log('Invalid email');
}

This code will output Valid email, because the trim method removes the leading and trailing whitespace from the email and the toLowerCase method converts the email to lowercase.

In ECMAScript 2019 (ES2019), two new string trimming methods were introduced: trimStart and trimEnd.

The trimStart method removes leading whitespace from a string, while the trimEnd method removes trailing whitespace.

Here is an example of how you can use these methods:

const str = '  Hello   ';

console.log(str.trimStart()); // Output: "Hello   "
console.log(str.trimEnd()); // Output: "   Hello"

You can use these methods instead of the trim method if you only want to remove leading or trailing whitespace from a string.

Keep in mind that the trimStart and trimEnd methods are not supported in all browsers, so you may want to use a polyfill if you need to support older browsers.

This article was produced with the help of ChatGPT


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by Bo Louie


Print Share Comment Cite Upload Translate Updates
APA

Bo Louie | Sciencx (2023-01-07T21:20:37+00:00) How do you check for valid email input?. Retrieved from https://www.scien.cx/2023/01/07/how-do-you-check-for-valid-email-input/

MLA
" » How do you check for valid email input?." Bo Louie | Sciencx - Saturday January 7, 2023, https://www.scien.cx/2023/01/07/how-do-you-check-for-valid-email-input/
HARVARD
Bo Louie | Sciencx Saturday January 7, 2023 » How do you check for valid email input?., viewed ,<https://www.scien.cx/2023/01/07/how-do-you-check-for-valid-email-input/>
VANCOUVER
Bo Louie | Sciencx - » How do you check for valid email input?. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2023/01/07/how-do-you-check-for-valid-email-input/
CHICAGO
" » How do you check for valid email input?." Bo Louie | Sciencx - Accessed . https://www.scien.cx/2023/01/07/how-do-you-check-for-valid-email-input/
IEEE
" » How do you check for valid email input?." Bo Louie | Sciencx [Online]. Available: https://www.scien.cx/2023/01/07/how-do-you-check-for-valid-email-input/. [Accessed: ]
rf:citation
» How do you check for valid email input? | Bo Louie | Sciencx | https://www.scien.cx/2023/01/07/how-do-you-check-for-valid-email-input/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.