Como validar CPF, CNPJ e Email com Expressões Regulares (REGEX)
Uma expressão regular ou “RegEx” provê uma forma de identificar cadeias de caracteres particulares, palavras ou padrões de caracteres. São simplesmente padrões utilizados para selecionar combinações de caracteres em uma string.
O que são Expressões Regulares (REGEX)?
Uma expressão regular é um padrão que identifica uma porção de texto. Elas são utilizadas para criar regras com o objetivo de validar dados, por exemplo, verificar se o que foi digitado é um endereço válido de e-mail ou se é um CPF ou CNPJ ou se uma senha contém apenas letras ou se combina letras e caracteres especiais, etc.
A idéia da validação é simples:
(a) Construa uma regra (Expressão Regular);
(b) Verifique se os dados digitados se “encaixam” na regra.
Uma regra é composta por caracteres especiais que representam o comportamento ou tipo de dado. Alguns exemplos de regras que podemos construir para identificar dados, são, por exmeplo, dados informados em um campo de um formulário, validando se estes dados são na ordem de:
- Possui um caractere especial como "@”?
- Contém apenas números?
- É composto por 11 números?
- Deve conter pelo menos 1 ponto?
Esses caracteres especiais, que serão usados para construir nossas regras, são chamados de metacaracteres. Embora a forma de construir as expressões regulares possam variar, dependendo da linguagem de programação utilizada, podemos citar alguns metacaracteres básicos de uma expressão:
. ? * + ^ $ | [ ] { } ( )
Vamos ver alguns exemplos básicos do uso destes caracteres. Abaixo, o uso básico e uma breve explicação do comportamento identificado por cada um destes metacaracteres.
No primeiro caso, será selecionado um conjunto de caracteres. Ao usar [a], uma validação ocorrerá e aos dados selecionados, será separada a porção que contenha a letra "a" dentro da string. Ou seja, ao usar os colchetes "[]" e uma letra, será separado.
Exemplo 1: ([o])
Exemplo 2: ([O])
Para RegEx, "O" e "o" são coisas diferentes. E na prática são mesmo. Expresões Regulares possuem seleção Case Sensitive, ou seja, uma letra minúscula tem propriedade diferente da maiúscula. Logo, o caracter "A" não é "a" na seleção.
Portanto, ([aeiou]) é diferente de ([AEIOU]).
Agora, usando o mesmo conjunto de dados, vamos aos exemplos:
Expressões Regulares (RegEx) na prática
Acima, você encontrou o básico da Expressão Regular. Agora, vamos aplicar algo muito comum e analisarmos a anatomia do RegEx validando dados.
Suponha que precisamos validar um e-mail e precisa enviar através de um formuário este dado sem que ele contenha erros. Emails não podem conter caracteres especiais, nem espaços, nem acentos, símbolos, emojis, espaços e possuem um padrão. Caso contrário, pensando em uma ação prática, se uma empresa captar leads em uma página promocional e o usuário digitar uma informação incorreta, haverá prejuízos na efetivação da comunicação.
Então, precisaríamos validar e permitir que o usuário digite seu e-mail mas não permitir erros na digitação. Para isso, usamos o RegEx!
Então, já sabemos que a informação que será enviada é do tipo email.
Logo, todos os caracteres acima serão proibidos:
. , ; : ‘ “ ? ! * + — % ^ $ [ ] { } ( ) # & = < > \ / | Ok, então, vamos avaliar na prática usando Javascript para validar um e-mail, excluir os caracteres e checar se o dado do formulário é verdadeira ou falsa.
Abra uma nova aba em branco no seu navegador:
about:blankAbra o seu console.
Se estiver usando Windows ou Linux:
Control + Shift + JOu usando um Mac:
Command + Option + JAgora, copie este código no seu Console:
function validarEmail (emailCapturadoDoFormulario)
{
let validarRegExNoEmail = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (emailCapturadoDoFormulario.match(validarRegExNoEmail)) {
return true;
} else {
return false;
}
}Este bloco acima é uma função em Javascript (para os não familiarizados) que resolve o problema. Após colar esta função em seu console, apenas aperte "ENTER" que ela será armazenada na memória (apenas para este teste).
Após digitar "ENTER" você vai ver isso:
Só não feche a tela do Console que tem mais um pouco!
Este bloco acima é uma função que resolve e valida em 3 grupos (ou blocos) o dado enviado para a variável validarRegExNoEmail.
Vamos por partes!
Abaixo temos a Expressão Regular compelta que valida se o dados está correto e que já foi atribuido na variável validarRegExNoEmail anteriormente:
/ … /
As barras representam respectivamente o início e no fim da RegEx.
^
O acento circunflexo (^) corresponde ao início da string.
\w+
A barra inversa (barra invertida ou contrabarra) com a letra w (\w) corresponde a todo caractere no formato (alfanumérico e sublinhado), no padrão ASCII baixos (sem acentos ou não romanos). Na prática, tudo equivalente ao formato de um caratere de A a Z (maiúsculo), de a a z (minúsculo), de 0 a 9 (números) e underline ( _ ), também conhecido por underscore ou subtraço.
Já o sinal de + (adição ou mais) significa que a partir da seleção de "\w", pode ter qualquer quantidade de caracteres, sem limitação.
(…)
Dentro de parenteses é agrupado vários tokens e cria um grupo de captura para extrair uma substring ou usar uma referência anterior. Dentro dele há colchetes […] que não validam estes dados de caracteres como explicado acima.
Logo, dentro dos parenteses (…)*@(…)*(…) ocorre a validação.
function validarEmail (emailCapturadoDoFormulario)
{
let validarRegExNoEmail = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (emailCapturadoDoFormulario.match(validarRegExNoEmail)) {
return true;
} else {
return false;
}
}let emailCapturadoDoFormulario = “meu$email#aqui@gmail.com”;console.log(validarEmail(emailCapturadoDoFormulario));
Ao executar todo este código o Console vai responder como falso. Afinal, o email informado na variável emailCapturadoDoFormulario possui dois caracteres não permitidos: $ e # dentro do primeiro grupo.
Agora, vamos reatribuir os valores de um email com caracteres corretos na variável emailCapturadoDoFormulario e testar a impressão no console.
let emailCapturadoDoFormulario = “email@gmail.com”;
Aqui conclui-se a validação do e-mail. Claro que não explorei uma validação dentro de um formulário nem fiz manipulações da DOM para uma interface gráfica. Mas, se você precisa ver funcionando, disponibilizei esta implementação no meu CodePen e pode testar já!
Caso deseje testar em seu editor, basta copiar o código fonte.
index.html
validarEmail.js
O post fala de CPF, CNPJ e Email. Cadê resto?
Bem, agora é só usar o padrão RegEx em seu código. Se chegou até aqui querendo apenas um tutorial ou um copia e cola, me desculpe!
Usei do meu tempo para ensinar os conceitos do RegEx e agora é com você. Seus skills em programação só serão elevados se conseguir implementar cada um dos conceitos (que está até fácil agora) deste artigo.
Então, só usar os seguintes padrões:
CPF
/^\d{3}\.\d{3}\.\d{3}\-\d{2}$/CNPJ
/^\d{2}\.\d{3}\.\d{3}\/\d{4}\-\d{2}$/Para ambos (CPF e CNPJ) ao mesmo tempo
/(^\d{3}\.\d{3}\.\d{3}\-\d{2}$)|(^\d{2}\.\d{3}\.\d{3}\/\d{4}\-\d{2}$)/Se você estiver usando Metafileds no Shopify tem até um espaço para RegEx.
Bons estudos e bora codar!
https://medium.com/xp-inc/regex-um-guia-pratico-para-express%C3%B5es-regulares-1ac5fa4dd39f
https://operahouse.com.br/expressoes-regulares
https://www.ramosdainformatica.com.br/programacao/regex-expressoes-regulares-codigos-diversos/
https://www.devmedia.com.br/validar-cpf-com-javascript/23916
