Sempre quis aprender expressões regulares (regex), mas se desanimou com a complexidade? Neste artigo, eu vou mostrar para você 5 truques com regex fáceis de aprender que você pode começar a usar imediatamente no seu editor favorito.

Configuração do editor de texto

Embora quase todos os editores de texto suportem expressões regulares, eu usarei o Visual Studio Code, mas você pode usar qualquer editor que você goste. Observe, também, que você geralmente precisa ativar a regex em algum lugar próximo ao campo de busca. Aqui está como fazer isso no VS Code:

1) . — Corresponde a qualquer caractere

Vamos começar pelo básico. O símbolo . equivale a qualquer caractere:

b.t

A regex acima equivale a "bot”, "bat” e qualquer outra palavra de 3 caracteres que comece com b e termine com t. Se, no entanto, você quiser pesquisar pelo símbolo de ponto, precisará "escapar" o símbolo usando \. Então, essa regex corresponderá ao texto exato "b.t":

b\.t

2) .* — Corresponde a qualquer texto

Aqui, . significa "qualquer caractere" e * significa "qualquer coisa antes desse símbolo repetida qualquer número de vezes". Juntos, (.*) significam "qualquer símbolo qualquer número de vezes" e servem para encontrar correspondências começando ou terminando em algum texto. Vamos supor que temos um método do JavaScript com a seguinte assinatura:

loadScript(scriptName: string, pathToFile: string)

Queremos encontrar todas as chamadas desse método onde pathToFile aponta para qualquer arquivo na pasta "lua" . Você pode usar a seguinte expressão regular para isso:

loadScript.*lua

Isso significa, "encontre todas as ocorrências de "loadScript" seguidas por qualquer texto até a última ocorrência de "lua""

3) ? — Correspondência não gananciosa

O ? depois do .* e algumas outras sequências de regex significa "Faça a correspondência ao mínimo possível". Se você olhar na imagem anterior, você verá que o texto "lua" aparece duas vezes em cada correspondência e que tudo até o segundo "lua" foi considerado. Se, ao invés disso, você quiser corresponder a tudo até a primeira ocorrência de  "lua", terá que usar a seguinte regex:

loadScript.*?lua

Ela significa, "Corresponda a tudo que começa com "loadScript" seguido por qualquer coisa até a primeira ocorrência de "lua""

4) ( ) $ — Captura grupos e referências anteriores

Ok. Agora, podemos encontrar alguns textos. Se quisermos, no entanto, mudar partes dos textos que encontramos? Geralmente, precisamos usar captura de grupos para isso.

Vamos supor que mudamos nosso método loadScript e agora, de repente, ele precisa de outro parâmetro inserido em seus outros dois parâmetros. Vamos chamar esse novo parâmetro de id. Então, a nova assinatura da função deve ficar assim: loadScript(scriptName, id, pathToFile). Nós não podemos usar a substuição normal do editor de texto aqui, mas uma expressão regular é exatamente o que precisamos.

Você pode ver acima o resultado da execução da seguinte expressão regular:

loadScript\(.*?,.*?\)

Ela significa: "corresponda a tudo que inicia com "loadScript(" seguido de qualquer coisa até o primeiro símbolo ,, seguido por qualquer coisa até o primeiro )"

As únicas coisas que podem parecer estranhas para você aqui são os símbolos \. Eles são usados para escapar os parênteses.

Precisamos escapar ( e ), pois eles são caracteres especiais usados no regex para capturar partes dos textos que corresponderam. Porém, precisamos corresponder aos caracteres de parênteses.

Na regex anterior, definimos dois parâmetros de nossa chamada de método com os símbolos .*?. Vamos fazer cada um dos nossos parâmetros um grupo de captura separado, adicionando os símbolos( e ) ao redor deles:

loadScript\((.*?),(.*?)\)

Se você executar essa regex, você verá que nada mudou. Isso é porque ela corresponde ao mesmo texto. Agora, contudo, podemos referenciar o primeiro argumento com $1 e o segundo argumento com $2. Isso é chamado de backreference (em português, referência prévia), e nos ajudará com o que queremos: adicionar outro parâmetro no meio da chamada.

Input de busca:

loadScript\((.*?),(.*?)\)

Isso significa a mesma coisa que a regex anterior, mas mapeia os parâmetros para capturar os grupos 1 e 2, respectivamente.

Input de substituição:

loadScript($1,id,$2)

Isso significa "substitua tudo que corresponda a "loadScript(" seguido pelo grupo de caracteres capturados 1, "id, grupo de caracteres capturados 2 e )". Observe que você não precisa escapar os parênteses no input de substituição.

5) [ ] — Classe de caracteres

Você pode listar caracteres que você quer corresponder a uma posição especifica colocando os símbolos [ e ] ao redor desses caracteres. Por exemplo, a classe [0-9] corresponde a todos os dígitos de 0 a 9. Você também pode listar os dígitos explicitamente: [0123456789] — o significado é o mesmo. Você pode usar o - com letras também. [a-z] vai corresponder a todos os caracteres minúsculos,[A-Z] corresponderá a todos os caracteres maiúsculos e [a-zA-Z] corresponderá a ambos.

Você também pode usar o * depois de uma classe de caracteres igual ao ., o que significa: "corresponda a qualquer número de ocorrências dos caracteres dessa classe".

Conclusão

Você precisa saber que existem vários tipos de regex. Esta que discutimos aqui é a regex da engine do JavaScript. A maioria das engines modernas é semelhante, mas pode haver algumas diferenças. Normalmente, essas diferenças incluem o caractere de escape e marcadores de refências prévias.

Eu encorajo você a abrir seu editor de texto e começar a usar alguns desses truques agora mesmo. Você verá que, agora, você consegue completar muitas tarefas de refatoração muito mais rapidamente do que antes. Quando se sentir confortável, pode começar a pesquisar mais sobre expressões regulares (texto em inglês).

Obrigado pela leitura deste artigo até o final. Se achou o artigo útil, compartilhe-o. Futuramente, publicarei mais artigos sobre expressões regulares, JavaScript e programação em geral.