Como substituir todas as ocorrências de uma substring em uma string

Resumo : neste tutorial, você aprenderá como substituir todas as ocorrências de uma substring em uma string.

O String tipo fornece os métodos replace()e replaceAll()que permitem substituir todas as ocorrências de uma substring em uma string e retornar a nova versão da string.

Observe que ambos os métodos não alteram a string original, mas retornam a nova string com as substrings substituídas por uma nova substring.

1) Usando o método replace()

O exemplo a seguir usa o replace()método para substituir a string 'JS'por 'JavaScript'em uma messagevariável:

const message = 'JS will, JS will, JS will rock you!';
const result = message.replace('JS','JavaScript');
console.log(result);Linguagem de código:  JavaScript  ( javascript )

Saída:

JavaScript will, JS will, JS will rock you!

Como você pode ver claramente na saída, o replace()método substitui apenas a primeira ocorrência de the JSna string.

Para substituir todas as ocorrências da 'JS'string, você transforma a string pesquisada em uma expressão regular e usa o sinalizador global ( g) assim:

const message = 'JS will, JS will, JS will rock you!';
const result = message.replace(/JS/g,'JavaScript');
console.log(result);Linguagem de código:  JavaScript  ( javascript )

Saída:

"JavaScript will, JavaScript will, JavaScript will rock you!
"Linguagem de código:  JSON/JSON com comentários  ( json )

Se você deseja substituir todas as ocorrências de uma substring e ignorar as letras maiúsculas e minúsculas, você precisa adicionar o sinalizador i à expressão regular:

const message = 'JS will, js will, Js will rock you!';
const result = message.replace(/JS/gi,'JavaScript');Linguagem de código:  JavaScript  ( javascript )

Saída:

"JavaScript will, JavaScript will, JavaScript will rock you!"Linguagem de código:  JSON/JSON com comentários  ( json )

2) Usando o método replaceAll()

O replaceAll()método substitui todas as ocorrências de uma substring em uma string e retorna a nova string. Por exemplo:

const message = 'JS will, JS will, JS will rock you!';
const result = message.replaceAll('JS','JavaScript');

console.log(result);Linguagem de código:  JavaScript  ( javascript )

Saída:

"JavaScript will, JavaScript will, JavaScript will rock you!"Linguagem de código:  JSON/JSON com comentários  ( json )

Se você deseja substituir todas as ocorrências de uma substring em uma string, independentemente das letras maiúsculas e minúsculas, use uma expressão regular com os gisinalizadores:

const message = 'JS will, Js will, js will rock you!';
const result = message.replaceAll(/JS/gi,'JavaScript');

console.log(result);Linguagem de código:  JavaScript  ( javascript )

Resultado:

"JavaScript will, JavaScript will, JavaScript will rock you!"Linguagem de código:  JSON/JSON com comentários  ( json )

Observe que o replaceAll()método não é compatível com todos os navegadores. Portanto, você deve verificar a compatibilidade do navegador antes de usá-lo.