Oct 20, 2021
entender Expressão Regular — Regex em Javascript
Vamos entender de uma vez por todas o objetivo da expressão regular na resolução de problemas na rotina de desenvolver códigos e como montar a sua para solucionar o problema que você estiver em questão.
As expressões regulares ou regex são formas simples de trocar elementos de um código-fonte e de aperfeiçoar a produtividade.
Nesse artigo, veremos
- O que é expressão regular?
- Principais conceitos
- Como uma expressão regular é utilizada na prática?
- O objeto RegExp
- Problemas do dia a dia
O que é expressão regular?
As expressões regulares são padrões para selecionar caracteres (ou combinações de caracteres) em uma string. No caso do JavaScript, aliás, as expressões regulares são, também, objetos. Assim, a gestão do código-fonte de um programa pode ser feita com mais segurança e agilidade.
As expressões regulares permitem que extraiam ou troquem partes do texto do código-fonte. Além disso, podem ser utilizadas para modificar endereços, links de imagens e a formatação de conteúdos em uma página HTML. Se a pessoa desejar, elas podem ser empregadas até para a remoção de caracteres inválidos.
Principais conceitos
As expressões regulares são representações que facilitam a busca por padrões no texto e isso torna a manipulação do código-fonte mais ágil e robusta.
Classes
As classes ajudam a encontrar múltiplos caracteres ao mesmo tempo. As vezes você pode procurar apenas pelas variáveis que tenham a letra A. Mas, se a busca demandar conteúdos com as letras A e J, as classes necessárias.
Uma classe deve ser definida com o apoio de colchetes []. Isso indica ao seu sistema que você busca por um conjunto específico de caracteres. Há algumas configurações que facilitam esse trabalho, aliás, que são as seguintes:
[A-z]indica que todas as letras do alfabeto devem ser apontadas;[0-9]indica que todos os números devem ser destacados, pode ser substituído por\d;[a-z0-9]aponta ao sistema que você busca letras e números, pode ser substituído pela expressão\w;[a-z]limita a busca a todas as letras minúsculas;^dentro dos colchetes ignora todas as combinações da classe, por exemplo,[^as]ignora todas as combinações que tenhamas;[A-Z]limita a sua busca apenas às letras maiúsculas;Wreduz a busca apenas a caracteres que não sejam alfanuméricos, como espaços e símbolos.
Âncoras
São úteis quando você deseja recuperar as posições que estão entre os caracteres. Porém, esse trabalho será executado sem a exibição dos caracteres indicados. Ou seja, ela aponta o que está próximo do referencial que você indicar, sem apontar esse referencial.
As âncoras podem ser utilizadas de duas formas, que são as seguintes:
- com um
^, que recupera todos os termos que estiverem no início da linha, por exemplo,^boloaponta todas as vezes em que a palavra bolo está no começo da linha; - com um
$, para apontar as vezes em que a expressão está no fim da linha, por exemplo,bolo$indica todos os casos em que a palavraboloestá no fim da linha.
Modos
Com o apoio de modos, você consegue ampliar o escopo das suas buscas. Por exemplo, para limitar a sua operação a itens como CaRrO, carro e CARRO, basta digitar (?i)carro. Assim, você não precisa digitar todas as formas de escrever um termo na sua expressão.
Buscas por múltiplos padrões
Quer empregar expressões regulares para encontrar dois ou mais padrões específicos. Para isso, basta utilizar |, que funciona como o termo OU/OR nas linguagens de programação. Assim, a expressão pode lidar com mais de um padrão facilmente.
Como uma expressão regular é utilizada na prática
Um cenário em que as expressões regulares são muito utilizadas é no preenchimento de formulários. Quem cria o sistema ou página web deve garantir que os usuários farão o preenchimento do documento dentro de um certo conjunto de padrões.
Para que isso seja possível, uma sequência de expressões regulares são implementadas. Assim, elas podem apontar para o programa que o usuário fez o uso de caracteres inválidos e exibir uma mensagem de erros. A expressão normalmente é moldada da seguinte maneira:
^\w*(\.\w*)?@\w*\.[a-z]+(\.[a-z]+)?$
- a expressão
^aponta para o sistema que uma nova linha ou string iniciou; \w*filtra caracteres alfanuméricos, como já apontamos. O asterisco é utilizado para garantir que todos os caracteres compatíveis com essa regra sejam apontados;(\.\w*)?os parênteses indicam o início e o fim de um agrupamento. A expressão\.é adotada para apontar a detecção de um ponto final. Já o\w*detecta caracteres alfanuméricos;- `.[a-z] aponta a existência de um ponto seguido de letras minúsculas (isso ajuda a identificar se o usuário digitou algo como .com, .org ou .net);
@limita apenas a endereços com o símbolo @;+indica que todos os itens que estiverem imediatamente após esse símbolo devem aparecer uma ou mais vezes no dado inserido pelo usuário;(\.[a-z]+)aponta que a letras minúsculas seguidas de um ponto final devem aparecer pelo menos uma vez após o símbolo @;?indica que a regra que vier imediatamente antes do interrogação deve aparecer na expressão nenhuma ou apenas uma vez;$finaliza o fim da regra.
Inserido no seu código, essa expressão regular consegue filtrar qualquer endereço compatível que não esteja dentro do padrão utilizado pelos provedores de e-mail.
Opções como “[]@[].org” ou “@com.@” serão apontadas como inválidas. Assim, o seu formulário terá apenas respostas válidas.
Expressões regulares são um grande ativo para que evitam erros na filtragem de conteúdos que pode diminuir o tempo necessário para lidar com expressões, modificar o código com mais rapidez e até mesmo garantir que formulários sejam preenchidos corretamente.
Para construir esse artigo, fiz algumas leituras, entre elas, esse artigo da betrybe
Continuar pesquisando sobre regexp.
O objeto RegExp
Uma expressão regular é um objeto que descreve um padrão de caracteres.
Expressões regulares são usadas para executar funções de correspondência de padrões e “pesquisar e substituir” no texto.
var patt = /w3schools/i
Exemplo explicado:
- / w3schools / i é uma expressão regular.
- w3schools é um padrão (para ser usado em uma pesquisa).
- i é um modificador (modifica a pesquisa para não fazer distinção entre maiúsculas e minúsculas).
Vamos ver algumas definições para construir a expressão regular que melhor solucione o problema:
Modificadores
Os modificadores são usados para realizar pesquisas globais e que não diferenciam maiúsculas de minúsculas:
g: Execute uma correspondência global (encontre todas as correspondências em vez de parar após a primeira correspondência)
i: Executar correspondência que não diferencia maiúsculas de minúsculas
m: Executar correspondência multilinha
Colchetes
Os colchetes são usados para encontrar uma variedade de caracteres:
[abc]: Encontre qualquer caractere entre os colchetes
[^abc]: Encontre qualquer caractere NÃO entre os colchetes
[0–9]: Encontre qualquer caractere entre os colchetes (qualquer dígito)
[⁰-9]: Encontre qualquer caractere NÃO entre os colchetes (qualquer não dígito)
(x|y): Encontre qualquer uma das alternativas especificadas
Metacaracteres
Metacaracteres são caracteres com um significado especial:
. Encontre um único caractere, exceto nova linha ou terminador de linha
\w Encontre um caractere de palavra
\W Encontre um caractere não verbal
\d Encontre um dígito
\D Encontre um caractere sem dígito
\s Encontre um caractere de espaço em branco
\S Encontre um caractere sem espaço em branco
\b Encontre uma correspondência no início / final de uma palavra, começando assim: \ bHI, terminando assim: HI \ b
\B Encontre uma correspondência, mas não no início / final de uma palavra
\0 Encontre um caractere NULL
\n Encontre um novo caractere de linha
\f Encontre um caractere de feed de formulário
\r Encontre um caractere de retorno de carro
\t Encontre um caractere de tabulação
\v Encontre um caractere de tabulação vertical
\xxx Encontre o caractere especificado por um número octal xxx
\xdd Encontre o caractere especificado por um número hexadecimal dd
\udddd Encontre o caractere Unicode especificado por um número hexadecimal dddd
Quantificadores
n+ Corresponde a qualquer string que contenha pelo menos um n
n* Corresponde a qualquer string que contenha zero ou mais ocorrências de n
n? Corresponde a qualquer string que contenha zero ou uma ocorrência de n
n{X} Corresponde a qualquer string que contenha uma sequência de X n’s
n{X,Y} Corresponde a qualquer string que contenha uma sequência de X a Y n’s
n{X,} Corresponde a qualquer string que contenha uma sequência de pelo menos X n’s
n$ Corresponde a qualquer string com n no final dela
^n Corresponde a qualquer string com n no início dela
?=n Corresponde a qualquer string seguida por uma string específica n
?!n Corresponde a qualquer string que não seja seguida por uma string específica n
Propriedades do objeto RegExp
constructor Retorna a função que criou o protótipo do objeto RegExp
global Verifica se o modificador “g” está definido
ignoreCase Verifica se o modificador “i” está configurado
lastIndex Especifica o índice no qual iniciar a próxima partida
multiline Verifica se o modificador “m” está definido
source Retorna o texto do padrão RegExp
Métodos de objeto RegExp
exec() Testa uma correspondência em uma string. Retorna a primeira correspondência
test() Testa uma correspondência em uma string. Retorna verdadeiro ou falso
toString() Retorna o valor da string da expressão regular
Problemas do dia a dia
Encontrei uma extensa lista de diversos problemas resolvidos com regex:
Ainda podemos testar as regex de forma mais visual pelos sites:
Referências
Para escrever esse artigo, estudei alguns textos bem interessantes
- A guide to JavaScript Regular Expressions
- 20 Small Steps to Become a Regex Master
- Regex tutorial — A quick cheatsheet by examples
Além da documentação javascript para Regex.
Esse artigo ficou mais longo, pois trata-se de um assunto mais complexo que precisamos de mais detalhes e exemplos para compreendermos o que estamos fazendo. Tomara que tenha gostado, aplauda o artigo! Até o próximo artigo e ótimos códigos.
