Localizando e substituindo dados com expressões regulares com JavaScript

Localizando e substituindo dados com expressões regulares com JavaScript

Vamos ver alguns exemplos de como trabalhar com a localização e substituição de dados, utilizando expressões regulares no JavaScript.

Expressões regulares é um recurso que existe em várias linguagens de programação que permitem validar strings de acordo com um determinado padrão.

Neste primeiro exemplo, vamos localizar a palavra "React" dentro de um texto.

var texto = "Tutoriais sobre NodeJS, React e PHP!";

var RegExp = /React/;

if (texto.search(RegExp) != -1) {

console.log("Encontrado na posição: "+ texto.search(RegExp));

} else {

console.log("Não encontrado!");

}

 

Vamos entender o que acabamos de executar. A variável RegExp guarda o padrão que desejamos localizar. Numa expressão regular, os padrões são inseridos entre as barras (/), perceba que elas aparerem no começo e no fim.

 var RegExp = /React/;

Uma string  possui o método "search", que retorna a posição inicial da informação que você pediu para encontrar. Quando a expressão não consegue localizar nenhuma informação compatível, o retorno e igual a -1. Em nosso exemplo, o parâmetro informado foi uma expressão regular.

Que tal um exemplo mais complicado? Vamos localizar um e-mail. Existem várias formas de escrever uma expressão para localizar um e-mail, de forma simplificada, o que vamos fazer é procurar um texto que tenha o seguinte formato

(qualquer quantidade de letras ou números)@(qualquer quantidade de letras ou números).(qualquer quantidade de letras ou números)

var texto = "O meu e-mail é: teste@teste.com.br. Entre em contato comigo!";

var RegExp = /[\w]+@[\w]+.[\w]+/;

if (texto.search(RegExp) != -1) {

console.log("E-mail localizado na posição: " + texto.search(RegExp));

} else {

console.log("E-mail não encontrado!");

}

Se você retirar o ".br" do e-mail, a pesquisa vai continuar funcionando:

var texto = "O meu e-mail é: teste@teste.com. Entre em contato comigo!";

var RegExp = /[\w]+@[\w]+.[\w]+/;

if (texto.search(RegExp) != -1) {

console.log("E-mail localizado na posição: " + texto.search(RegExp));

} else {

console.log("E-mail não encontrado!");

}

Uma forma mais completa de fazer a pesquisa é a utilização do método "match".  No próximo exemplo, vamos localizar uma data.

var texto = "Data de entrega: 01/11/2019";

O formato da expressão regular será localizar uma informação que tenha dois números, uma barra, dois numeros, mais uma barra e quatro números no final.

var texto = "Data de entrega: 01/11/2019";

var RegExp = /[\d]{2}\/[\d]{2}\/[\d]{4}/;

if (texto.match(RegExp) != null) {

console.log("Frase: "+texto.match(RegExp).input);

console.log("Caractere inicial: "+texto.match(RegExp).index);

console.log("Caractere final: "+texto.match(RegExp).lastIndex);

console.log("Resultado: "+texto.match(RegExp)[0]);

} else {

console.log("Não foi localizado!");

}

Perceba que o match possui métodos que retornam a posição inicial e final da expressão localizada. Como eu posso ter mais de uma ocorrência da informação pesquisada, os dados válidos são retornados dentro de um array, então o seguinte cõdigo:

texto.match(RegExp)[0]

Retorna a primeira ocorrência localizada.

Sabendo disso, podemos fazer a substituição. Supondo que a data esteja errada, para fazer a troca de "01/11/2019" para "07/11/2019", utilizaremos o método "replace" da string texto. O código final ficaria da seguinte forma:

 

var texto = "Data de entrega: 01/11/2019";

var RegExp = /[\d]{2}\/[\d]{2}\/[\d]{4}/;

 

if (texto.match(RegExp) != null) {

console.log("Frase: "+texto.match(RegExp).input);

console.log("Caractere inicial: "+texto.match(RegExp).index);

console.log("Caractere final: "+texto.match(RegExp).lastIndex);

console.log("Resultado: "+texto.match(RegExp)[0]);

texto = texto.replace(RegExp,"07/11/2019");

console.log(texto);

} else {

console.log("Não foi localizado!");

}

 

Está começando e deseja saber o que precisa estudar de HTML e JavaScript? Não deixe de conferir os roteiros de estudo de HTML e JavaScript!. São dezenas de conteúdos para você melhorar suas habilidades.

Roteiro de estudos - HTML e CSS

Roteiro de estudos - Javascript

 

Outros conteudos que podem ser de seu interesse

Separando um array de strings em conjuntos de arrays ordenados alfabeticamente com JavaScript
19/03/2023JAVASCRIPT

Separando um array de strings em conjuntos de arrays ordenados alfabeticamente com JavaScript

Veja várias formas de separar um array de string com JavaScript

Saiba mais...
Ler arquivo PDF com NodeJS
01/12/2019JAVASCRIPT

Ler arquivo PDF com NodeJS

Veja como extrair o texto de um arquivo PDF usando NodeJS

Saiba mais...

Conteúdo sobre banco de dados sem complicação!