Regex em JavaScript | Explicado com exemplos

Regex em JavaScript | Explicado com exemplos
Quando um desenvolvedor primeiro se de olhos em expressões regulares ou regex, parece sem sentido. No entanto, eles podem parecer, expressões regulares são extremamente úteis e fazem de você um programador eficaz. O conceito regex é um pouco complicado, no entanto, neste post, seguiremos você por etapas simples junto com exemplos para ajudá -lo a dominar Regex em JavaScript.

O que é regex em javascript?

Regex ou expressão regular é simplesmente uma string que define um padrão e é muito útil para encontrar um padrão em uma string ou substituir uma string por um padrão correspondente. Para simplificar, suponha que você queira validar um endereço de e -mail ou número de telefone com um padrão especificado, então Regex é útil.

Sintaxe regex:

var myRegex = /abc /;

Nós incluímos um padrão na barra para frente "/" como mostrado acima. Também podemos usar o Regexp construtor para definir um padrão regex:

var myRegex = novo regexp ('abc');

Agora que sabemos o que é regex e o que é sua sintaxe, vamos agora ver como especificar um padrão usando regex em javascript.

Especifique o padrão usando regex

Para especificar padrões usando regex, usamos metacaracters, que são caracteres que têm significado especial. Metacharacters e o que eles representam em Regex é apresentado na tabela abaixo:

Meta caráter O que isso faz?
[] (Suportes quadrados) Tudo o que escrevemos entre os colchetes será combinado com uma determinada string. Por exemplo [abc] corresponde ao a, b, e c caracteres com uma string especificada. Também podemos especificar um intervalo, por exemplo, [a-f] é o mesmo que [ABCDEF] ou [1-5] é o mesmo que [12345].
^ (Símbolo intermediário) O símbolo de cuidar é usado para verificar se um texto ou string especificado começa com um determinado personagem ou não e e não.g. ^a combina com a ABC no entanto ^a não combina com bac. O símbolo do cuidador entre colchetes é usado para levar o complemento de caracteres especificados. Por exemplo [^ABC] Especifica isso, exceto A, B ou C Qualquer personagem presente será comparado.
$ (Símbolo do dólar) O $ Símbolo é usado onde quer que queira verificar se uma string termina com um determinado personagem ou não. Por exemplo, A $ significa que qualquer string com a qual estamos combinando deve ter um no final, ou seja, amnésia será combinado com A $ No entanto, o coração não vai.
* (Símbolo de estrela) O símbolo de estrela corresponde a 0 ou mais ocorrências do padrão ou caractere especificado presente à esquerda do símbolo estrela em uma string. Por exemplo, homem significa que a pesquisa m e um personagem em uma string. Por isso mn terá 1 partida. Principal não terá correspondência, pois um não é seguido por n e aqui está eu entre.
+ (mais símbolo) O símbolo Plus é como um símbolo de estrela com a exceção de que corresponde a 1 ou mais ocorrências do padrão ou personagem especificado. Por exemplo, quando mn String é pesquisada pela expressão ma+n No entanto, não há correspondência quando a expressão é pesquisada para o homem, há uma partida.
(Aparelho ortodôntico) Para ter uma compreensão clara dos aparelhos, vamos primeiro ver o seguinte código i-e 2,3 o que significa que pelo menos 2 e no máximo 3 repetições é possível do padrão deixado dele. Por exemplo, a expressão a 2,3 Quando combinado com a string “ABC DAT” não terá correspondência, no entanto, quando a expressão for combinada com o “ABC Daat” ele terá uma partida i-e Daat.
| (Alteração) A alteração ou símbolo de barra vertical é usado para o operador ou. Por exemplo, a expressão A | B indica que a ou b deve estar presente em uma string especificada. Por isso fgh não tem correspondência e abc tem 2 partidas que são ab.
\ (Barragem) O objetivo da barra de barriga é escapar dos personagens e escapar de todos os metacharacters. Em palavras simples, se você não tiver certeza se um personagem contém algum significado especial ou não, coloque uma barra de barra antes do personagem. Portanto, esse personagem não será tratado de nenhuma maneira especial, por exemplo, \ $ a a expressão corresponderá a qualquer texto ou string que tenha um $ seguido pela a.

Agora que sabemos como especificar padrões usando regex, vamos agora passar por alguns métodos regex para combinar com uma regex com uma string especificada.

Padrões de teste para correspondência

Anteriormente, discutimos como podemos usar o construtor regexp para inicializar o objeto regexp com um padrão especificado. Este objeto regexp nos dá muitos métodos internos e um deles é o teste() método. O teste() O método é muito útil, pois verifica uma string para um padrão especificado na expressão regular. O teste() O método retorna um valor booleano, ou seja, se o padrão especificado corresponde à string, em seguida. Para entender melhor o teste() Método Vamos ver um exemplo:

var myRegex = /hello /;
var output = myRegex.Teste ('Hello World!');
console.log (saída); // verdadeiro

No código acima primeiro, definimos um padrão que é Olá e depois usou o teste de método interno () no padrão especificado para verificar se a string Olá Mundo! contém olá ou não. O resultado é dado abaixo:

Em vez do valor booleano, a correspondência da string também pode ser retornada com outro método interno que é o método correspondente (). O código abaixo está implementando o método Match ():

var mystring = "Hello World!";
// padrão
var myRegex = /hello /;
console.log (mystring.match (myRegex)); // Olá

Uma matriz será retornada que conterá a sequência de entrada ao método Match (), o índice no qual a correspondência é encontrada, bem como a própria partida.

Se uma partida não for encontrada então nulo será retornado:

var mystring = "Hello World!";
// padrão
var myRegex = /hi /;
console.log (mystring.match (myRegex)); // nulo

Sinalizadores de padrão

Vimos que o objeto regexp aceita um padrão; No entanto, também deve -se notar que o regexp também pode levar um parâmetro de bandeira opcional. As bandeiras são apenas um pouco de cobertura extra que muda o comportamento de pesquisa.

A primeira bandeira que discutiremos é o ignore a bandeira denotado por i. Por padrão, a pesquisa de padrões em Regex é sensível ao caso, para ignorar os casos, usamos a bandeira ignorada (i) ao procurar um padrão. Por exemplo:

var myRegex = /hello /i;
console.log (myRegex.teste ("Hello World!")); // verdadeiro

Embora o padrão tenha olá E a string no método de teste tem a primeira letra capital, ainda é uma correspondência porque usamos a bandeira ignorada (i), portanto, o resultado será verdadeiro:

Para usar o sinalizador ignorado com o objeto regexp copiar o seguinte código:

var myRegex = novo regexp ('hello', 'i');
console.log (myRegex.teste ("Hello World!")); // verdadeiro

Da mesma forma, podemos usar o Bandeira global denotado por G cuja função é retornar todas as partidas na string. Sem a bandeira global, apenas a primeira partida é devolvida. O código abaixo usa a bandeira global:

var myString = 'Olá mundo! e olá universo!';
var myRegex = /hello /gi;
var correspondem = [];
VAR corresponde;
fazer
Match = MyRegex.exec (mystring);
if (correspondência)
partidas.push (correspondência);

while (correspondência != nulo)
console.log (correspondências);

Primeiro, inicializamos o MyString, que contém a string que será usada para pesquisar um padrão e, depois disso, criamos um padrão de expressão regular que contém a bandeira global e ignoramos a bandeira. A bandeira global procurará todas as correspondências, enquanto a bandeira ignora ignorará a sensibilidade ao caso. No código acima, outro método interno é usado, que é o EXEC () cuja função é retornar uma matriz que contém a partida. No entanto, se não houvesse correspondência entre o padrão e a corda, então NULL será devolvido. Deve-se notar que o método EXEC () retorna apenas uma única partida ao mesmo tempo, daí que usamos o loop de fazer-e empurrar todas as partidas para a matriz de partidas. No final, console o Log the Matches Array, que contém todas as correspondências:

Conclusão

Regex é uma string que define um padrão ou encontra um padrão em uma string especificada. Usamos o objeto regexp ou o atacante / para definir regex. O regexp também leva um parâmetro opcional I-E sinalizador que muda o comportamento de pesquisa. Para especificar padrões, usamos metacaracters, que são alguns caracteres específicos com significados especiais. Para testar se ela corresponde a uma string ou não, usamos métodos internos como test (), correspondência () ou exec ().

Neste post, primeiro, definimos o que é regex em javascript e o que é a sintaxe regex em javascript. Em seguida, mostramos como especificar padrões usando os padrões de regex e teste em javascript. No final, discutimos as duas bandeiras que são globais e ignoram bandeiras.