Expressão regular para validar e-mail JavaScript (regex)

Neste artigo você vai aprender uma expressão regular para validar e-mail em JavaScript, conhecida também como regex ou regular expression de email

Fala programador(a), beleza? Bora aprender mais sobre regex em JavaScript e como validar e-mails!

Neste caso, eu particularmente, prefiro me ater ao simples mas eficaz

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

Há expressões regulares muito avançadas que podem funcionar para 98% dos e-mails existentes

Mas são tão complexas que deixam alguns e-mails válidos de fora

Diante disso, opto sempre por algo mais generalista para não prejudicar usuários, no padrão:

[email protected]

Desta forma não validaremos caracteres especiais no e-mail e sim se é um texto

Deixamos esta validação para o back-end de sanitização dos inputs, no front apenas rejeitamos os casos obviamente equivados

Como chegar neste resultado então?

A expressão regular será a seguinte:

/\S+@\S+\.\S+/

Podemos aplicar com JavaScript da seguinte forma:

function validarEmail(email) {
  var re = /\S+@\S+\.\S+/;
  return re.test(email);
}

Esta função vai validar um texto utilizando a expressão regular acima mencionada

Tenha em consideração o que falei anteriormente também, provavelmente alguns e-mails inválidos vão passar

Mas é mais uma questão de o usuário ser malicioso do que a regex ser ruim

Pois é melhor deixar estas validações para o back-end, do que impossibilitar um usuário comum de prosseguir no sistema

Lembre-se que você pode perder uma venda por deixar uma expressão regular rígida demais

Usuários leigos podem não entender o que está acontecendo, e então deixar o site

Conclusão

Neste artigo vimos como criar uma expressão regular para validar e-mail JavaScript

Neste caso reforcei os pontos que ela deixa alguns e-mails inválidos passar, mas que não é o trabalho do front-end fazer uma validação tão complexa também

Acredito que o front sirva mais como uma ‘máscara’ para os inputs e o back-end que vai livrar das possíveis invasões

Até por que o JavaScript pode ser facilmente burlado ou desativado

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube