No artigo anterior vimos o que é uma expressão regular e até colocamos alguns de seus recursos em prática. Hoje vamos continuar praticando, mas dessa vez iremos aprender a capturar dados utilizando regex.

Estudos de casos

Nosso primeiro exercício nada mais é que capturar todos os números de uma determinada string:

// Vamos criar nosso padrão
let pattern = /(\d{2})(\d{5})(\d{4})/;

'85912345678'.match(pattern);

Aqui utilizamos o metacaractere \d, que representa um número, e fazemos a captura utilizando os caracteres (). Nada muito complexo, porém, podemos utilizar regex com outras funcionalidades da linguagem para termos algo ainda mais poderoso, por exemplo, vamos aplicar um pequena formatação nesses números:

// Neste caso vamos combinar com o método replace.
'85912345678'.replace(pattern, '($1) $2-$3');
// O código acima retorna (85) 91234-5678

No método replace, basicamente trabalhamos com o valor de cada captura por meio do $númeroDaCaptura, então podemos reorganizar, ocultar, etc, você consegue manipular o valor da captura.

Outro exercício, é justamente o inverso, vamos pegar um CPF formatado e exibir apenas os números:

// Vamos criar nosso padrão
pattern = /(\d{3})\.(\d{3})\.(\d{3})-(\d{2})/;

'210.458.522-05'.replace(pattern, '$1$2$3$4');
// O código acima retorna 21045852205

Uma forma diferente de resolver o exercício anterior, é capturar qualquer coisa que não seja número, e substituir por uma string vazia:

// Vamos criar nosso padrão
pattern = /([^\d])/g;

'210.458.522-05'.replace(pattern, '’);
// O código acima retorna 21045852205

Em nosso padrão, capturamos tudo dentro do agrupador [], dentro dele, informamos que queremos tudo que seja número, por meio do \d, mas antes invertemos essa lógico por meio do caractere ^. A gente já viu isso no primeiro artigo, lembram?

Algo novo fica por conta do g após a expressão. Ele informa que toda a string deve ser analisada, capturando todos os elementos que casem com nosso padrão. Veremos isso melhor em outro exemplo.

Poderíamos simplificar o código acima, alterando o conteúdo dentro de [], para o código abaixo:

// Vamos criar nosso padrão
pattern = /([\D])/g;

'210.458.522-05'.replace(pattern, '’);
// O código acima retorna 21045852205

Substituímos o código ^\d pelo metacaractere \D que representa qualquer coisa que não seja um número.

Agora vamos para outro desafio, nele temos uma string contendo vários números de cpf, nomes de pessoas e datas de nascimento, e temos a tarefa de capturar todas as datas de nascimento. Com tudo o que vimos até aqui, não fica tão difícil de criar o código, vejam:

const data = `210.458.522-05;Erandir Junior;1950-12-12
543.341.836-05;Marcos Antonio;1979-05-20
948.183.538-05;Maria Joaquina;1982-03-28
472.729.923-05;João da Silva;1990-10-01`;

// Podemos utilizar o método match para fazer a captura
data.match(/(\d{4}-\d{2}-\d{2})/);

Se formos executar o código acima, teremos um retorno positivo, porém, podemos ver que a única data capturada foi a primeira, para resolver isso, precisamos informar a regex que é necessário analisar todo o conteúdo em busca de todos os dados que atendam ao padrão definido, para isso basta adicionar um g após do fechamento da regex:

data.match(/(\d{4}-\d{2}-\d{2})/g);

Agora sim temos um retorno com todas as datas que atendem nosso padrão. O g, informa que devemos buscar em toda a string todos os casos que atendem a regex informada. Acredito que com esse exemplo tenha ficado mais fácil de entender seu uso.

Uma outra pequena atividade seria capturar todas as datas, e retornar a mesma string com as datas em padrão brasileiro:

data.replace(/((\d{4})-(\d{2})-(\d{2})/g, '$4/$3/$2');

Aqui continuamos trabalhando com capturas, pegando todos os casos, a diferença é que eu ignoro a primeira captura, que seria a data inteira, substituindo seu valor pela data formatada.

Finalizando

O foco principal deste artigo foi realmente mostrar como trabalhar com grupos de captura, e manipular os valores capturados, existem muitos outros recursos que uma expressão regular oferece, eu mesmo não teria como passar tudo, então o dever de casa de vocês é procurar outros conteúdos e estudar. Vejo você no próximo artigo, até mais.