diegoeis.com

RSS @diegoeis
Seja o primeiro a comentar tags: desenvolvimento front-end

O básico sobre Expressões Regulares

Expressão Regular é uma das ferramentas mais úteis que você pode ter. Vira e mexe as Expressões Regulares (RegExp) resolvem desde problemas de Find & Replace no editor até validação de dados em diversos níveis do seu projeto. Mas geralmente a gente só lê sobre Expressões Regulares quando precisamos decifrar aquela linha maluca e ainda assim de um jeito meio descuidado, tateando e tentando fazer dar certo uma combinação de caracteres sem sentido.

Entendendo as Expressões

Uma Expressão Regular é uma representação para que você encontre padrões em um texto. Esse texto pode ser qualquer coisa, desde o valor de um campo de formulário ou simplesmente um search no seu editor de código predileto… Não importa… O objetivo é filtrar padrões em um punhado de informação textual.

Se você entender que uma Expressão Regular é apenas uma representação formada por símbolos, você não vai ter dificuldades. Cada símbolo representa um tipo de informação. Por exemplo: o . (ponto) é um curinga. Ele significa que você pode selecionar qualquer caractere, ou seja, qualquer letra, caractere especial ou número. Exceto a quebra de linha, que é representado pelo símbolo \n.

Classe de caracteres

Vamos começar pelo mais fácil: quando você faz uma busca, você pode buscar uma combinação de caracteres específica, por exemplo: no seu editor de código, se você fizer uma busca por a, ele vai te mostrar todas as letras a do documento. Mas e se você quiser procurar todas as letras a e as letras e? Simples, você faz um agrupamento utilizando os colchetes []. Essa expressão irá encontrar todos os caracteres que estiverem dentro dos colchetes. Veja esse exemplo, onde ele filtra as letras [ue]. Isso se chama classe de caracteres, onde você encontra vários caracteres diferentes ao mesmo tempo.

Bom, se você quiser selecionar TODAS as letras do texto, você não precisa escrever o alfabeto inteiro dentro dos colchetes, basta só usar a representação [A-z]. Isso quer dizer que ele pega as letras de A até Z, maiúsculas ou minúsculas.

Se você quiser pegar os números, por exemplo, use [0-9]. Se quiser todas as letras e todos números: [A-z0-9]. Pra facilitar a expressão, você pode usar \w, que vai dar no mesmo.

Para você fazer uma negação da Classe criada, basta adicionar um ^ dentro da classe. Por exemplo, você quer pegar todas as combinações que não sejam formadas pela sequência es: [^es]. Veja esse exemplo aqui.

Exemplos de classes de caracteres:

Atalhos para as classes mais comuns:

E as classses de negação. Lembrando que basta colocar o sinal de ^ logo depois do colchete inicial [:

Múltiplos padrões

Imagine agora que você queira encontrar dois padrões diferentes de caracteres, por exemplo, duas palavras. Bastando usar o símbolo | (pipe), que vai significar OU. Nesse caso a expressão irá reconhecer um ou o outro padrão. Veja esse exemplo onde recuperamos o retorno das palavras dolor ou labore.

Âncoras

As âncoras recuperam a posição entre os caracteres, mas não os caracteres em si. Por exemplo, a expressão ^dolor, vai recuperar as palavras dolor que estiverem no início da linha (veja o exemplo). A expressão dolor$ vai recuperar o termo que estiver no final da linha (veja o exemplo).

Modos

Agora, suponha que você queira pegar uma sequência que contenha um termo parecido, mas que possa estar com algumas letras maiúsculas ou minúsculas. Por exemplo os termos Lorem, lorem, loRem, lOrEm etc, bastaria usar a representação (?i) antes do termo a ser buscada. A expressão ficaria assim (?i)lorem. Veja este exemplo aqui.

Brincando de validar um email

Uma tarefa muito corriqueira é a validação de campos de e-mail. Sem entrar nas polêmicas (validar essas coisas sempre é chato), mas é legal para treinar o que você acabou de ler. A expressão para fazer a validação é essa:

1
^\w*(\.\w*)?@\w*\.[a-z]+(\.[a-z]+)?$

Explicando:

Veja funcionando abaixo:

Para você testar e aprender

Existem alguns sites pra facilitar a criação e o debug das expressões regulares, veja abaixo: