Regex é uma linguagem formal que permite identificar padrões de caracteres dentro de um texto. E é muito utiliza em editores para encontrar e manipular pedaços de texto, nós podemos utilizar para identificar trechos específicos dentro de um xml, um csv, dados dentro de um formulário e qualquer fonte de texto.

Segue abaixo alguns exemplos da forma mais simples até um ponto mais recomendado, você pode testar usando o site rubular.com para acompanhar os exemplos:

Dígitos numéricos com Regex : Quando queremos nos referir a dígitos em um pattern, colocamos uma abreviação de dígito = \d

Por exemplo para exigir que um campo de CPF tenha 11 dígitos, colocaria:

 
  pattern="\d\d\d\d\d\d\d\d\d\d"   

Porém neste padrão acima, ficaria muito custoso manter pelo tanto de repetição e passível de falhas, então para facilitar, pode-se utilizar o recurso de repetição em regex, que é colocar entre chves o número de repetições desejadas ou limitada:


este mesmo padrão é equivalente ao de cima, muito mais simples de manter e entender.

 
  ​pattern="\d{11}"   

Para validarmos o caracter if no final do cpf podemos utilizar o operador ? que serve para dizer que pode ou não ter este caracter, ficando assim:


Aqui teremos três blocos de 3 dígitos, o hífen e o operador ? que indica que o  hífen é opcional, pode ou não existir.

 
  pattern="\d{3}.\d{3}.\d{3}-?\d{2}"   

Dígitos literais e conjuntos com Regex

Indica que podemos usar qualquer letra do alfabeto no intervalo de a até z.


Para letras do alfabeto neste intervalo:

 
  pattern="[a-z]"
pattern="[A-Z]"   


Para se utilizar o comum é [a-zA-Z] esse grupo ja indica de forma agrupada todas letras.

E para utilizar esse grupo de letras com números, basta colocar o indicador de dígitos que é o \d ficando:

 
  ​​pattern="[a-zA-Z\d]"
   

E para funcionar com qualquer palavra utilizamos o operador + que indica que uma ou mais letras deste mesmo grupo ficando.

 
  pattern="[a-zA-Z\d]+"   

exemplo simples de validação de email:

 
  pattern="[a-zA-Z\d]+@[a-zA-Z\d]+\.[a-zA-Z\d]+\.[a-zA-Z\d]+"   

E para melhorar a forma de validação acima que está muito repetitiva.

Usamos o operador \w que é equivalente ao [a-zA-Z\d_] que representa uma "word".

 
  pattern="\w+@\w+\.\w+\.?\w?\w?+"   

E para melhorar ainda podemos utilizar o caractere especial *, que é o equivalente ao caractere ? e o +. Utilizando o * o caractere  antes dele pode ser presente ou não e pode aparecer mais de uma vez ou não também.

 
  pattern="\w*@\w*\.\w*\.\w*"   


Como tratar grupos em regex :

exemplo cartão de crédito:  9999-9999-9999-9999

Forma sem agrupamento

 
  pattern="\d{4}[ -]\d{4}[ -]\d{4}[ -]\d{4}"   

 

Neste grupo acima podemos notar que várias partes se repetem então podemos agrupar utilizar o () entre as partes identificadas exemplo:

\d{4} = indica teremos 4 dígitos iniciais

([ -]\d{4}) = indica que este grupo pode se repetir na expressão

{3} =  e para finalizar nesse pattern, este indica que este grupo pode se repetir 3 vezes.

 
  pattern="\d{4}([ -]\d{4}){3}"   

 

Este post é apenas o básico desta linguagem formal, que seu uso cresce a cada dia dentre nós desenvolvedores.