Reemplazar todas las instancias de una cadena en JavaScript

1. Utilice la función de JavaScript incorporada String.prototype.replaceAll() para reemplazar todas las apariciones de una cadena
2. Use una expresión regular con el indicador g para reemplazar todas las apariciones de una cadena en JavaScript
3. Utilice split() y join() para navegadores antiguos o por razones de compatibilidad

JavaScript le permite reemplazar todas las apariciones de un carácter o una subcadena en una cadena usando un par de métodos.

No todos los métodos son iguales en términos de velocidad y utilización de recursos, por lo que es importante definir claramente su caso de uso antes de decidir cuál es el mejor método. Además, la mejor solución depende de los navegadores a los que se dirija o, más exactamente, de las versiones del navegador.

Por lo tanto, es posible que los navegadores más antiguos no puedan comprender la funcionalidad de JavaScript recién introducida. Por ejemplo, el método replaceAll es la opción más fácil y recomendada, pero no funcionará con ninguna versión de Internet Explorer. Afortunadamente, hay otras formas de lograr el mismo resultado en navegadores más antiguos, como se detalla a continuación.

Utilice la función de JavaScript incorporada String.prototype.replaceAll() para reemplazar todas las apariciones de una cadena

Es, con diferencia, la solución más sencilla disponible en JavaScript, especialmente porque forma parte de la biblioteca estándar. No necesita crear su propia función desde cero, y este método también es considerablemente más rápido que la mayoría de las otras implementaciones.

const my_string = 'abc 123 abc 456 abc 789 abc';

console.log(my_string.replaceAll('abc', 'xyz'));

Producción :

"xyz 123 xyz 456 xyz 789 xyz"

Pase la cadena de reemplazo como una variable con el método String.prototype.replaceAll()

El ejemplo anterior requiere que ingrese manualmente tanto la cadena original como el reemplazo como argumentos de función. En caso de que desee pasar la cadena de reemplazo como una variable, puede usar el siguiente método en su lugar:

const my_string = 'abc 123 abc 456 abc 789 abc';
let rep_string = 'xyz';

console.log(my_string.replaceAll('abc', rep_string));

Producción :

"xyz 123 xyz 456 xyz 789 xyz"

De hecho, también puede pasar ambos argumentos como variables. Como era de esperar, todo lo que necesita hacer es crear otra variable para almacenar la subcadena que desea reemplazar y luego pasarla como el primer argumento del método replaceAll.

const my_string = 'abc 123 abc 456 abc 789 abc';

let substring = 'abc';
let rep_string = 'xyz';

console.log(my_string.replaceAll(substring, rep_string));

Producción :

"xyz 123 xyz 456 xyz 789 xyz"

Use una expresión regular con el indicador g para reemplazar todas las apariciones de una cadena en JavaScript

Otra forma de lograr el mismo resultado es usando una expresión regular con el indicador g y el método replace(). La desventaja de usar este método es que puede ser más lento, así que trate de evitarlo si la velocidad de ejecución es una prioridad en su aplicación.

La bandera g significa global, y sin ella, el código arrojará un TypeError si intenta ejecutarlo. Es un requisito cuando se trabaja con objetos de expresiones regulares y el método replace().

const my_string = 'abc 123 abc 456 abc 789 abc';
let new_string = my_string.replace(/abc/g, 'xyz');

console.log(new_string)

Producción :

"xyz 123 xyz 456 xyz 789 xyz"

Utilice split() y join() para navegadores antiguos o por razones de compatibilidad

Como se mencionó anteriormente, es posible que los navegadores más antiguos no entiendan la nueva funcionalidad de JavaScript, como es el caso del método replaceAll(). Puede lograr los mismos resultados en esos casos dividiendo y uniendo su cadena en su lugar.

Recuerde que esta es una solución bastante mala en términos de optimización, así que evite usar este método si su código no es compatible con software anterior.

const my_string = 'abc 123 abc 456 abc 789 abc';
let new_string = my_string.split('abc').join('xyz');

console.log(new_string);

Producción :

"xyz 123 xyz 456 xyz 789 xyz"

Debería ser bastante obvio que la solución general implica usar split() para la cadena que desea buscar y join() para la cadena con la que desea reemplazarla. Para aclarar aún más las cosas, así es como puede pasar las cadenas originales y de reemplazo como variables en lugar de codificarlas de forma rígida:

const my_string = 'abc 123 abc 456 abc 789 abc';

original_string = 'abc';
replacement_string = 'xyz';

let new_string = my_string.split(original_string).join(replacement_string);

console.log(new_string);

Producción :

"xyz 123 xyz 456 xyz 789 xyz"