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?

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:

Â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:

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]+)?$

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:

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

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.

Developer Frontend Web — Javascript | ReactJS https://linktr.ee/douglasabnovato

Developer Frontend Web — Javascript | ReactJS https://linktr.ee/douglasabnovato