Sustituir subcadenas

Los métodos replace() y replaceAll() permiten buscar y substituir partes de una cadena de caracteres por otro texto, y devolver el resultado como una nueva cadena con el reemplazo hecho. No se modifica el original

  • replace(busca, reemplazo) busca un texto y lo cambia una vez
  • replaceAll(busca, reemplazo) busca y cambia todos los textos encontrados

La diferencia esté en que el primiero solo sustituye la primera coincidencia con el patrón o cadena que se le pasa como primer argumento y la segunda lo hace con tadas las coincidencias.

El primer argumento puede ser una cadena o un patrón de búsqueda, una expresión regular que define el modelo del texto buscado y el segundo argumento es el nuevo texto que sustituye al encontrado.

let frase="Vamos a la playa porque en la playa hace fresco"

let cambio;

cambio = frase.replaceAll("playa", "montaña");

console.log(cambio)

Este ejemplo muestra la forma más simple de un reemplazo, el resultado queda como "Vamos a la monaña porque en la montaña hace fresco" . Se han cambiado todas ls coincidencias de playa por montaña.

En este otro caso solo se cambia una coincidencia

let frase="Vamos a la playa porque en la playa hace fresco"

let cambio;

cambio = frase.replace("playa", "montaña");

console.log(cambio)

En esta ocasión solo se ha sustituido la primera ocurrencia de playa, la segunda se mantiene sin cambiar. Queda "Vamos a la montaña porque en la playa hace fresco"

En ambos ejemplos se ha usado un texto concreto para hacer el cambio. Pero fíjate en el primer ejemplo que si la palabra playa aparece en mayúsculas el reemplazo fallaría.

¿Solución? usar patrones, al igual que se hace en los métodos de búsqueda como search. En este ejemplo queremos cambiar todas las palabras "aula" seguidas del guión y el número por la palabra "Aula".

let frase="Busca el aula en la lista: aula-1, aula-2, aula-3"

let cambio;

cambio = frase.replacel(/\baula(-\d)/ig, "Aula$1");

console.log(cambio)

En este ejemplo no se sustituye la primera palabra "aula" por que la expresión regular señala que busque esa palabra pero seguida del guión y el dígito.

Fíjate que el patrón tiene algunas partes entre paréntesis, son subpatrones que se pueden referir con $nn, donde nn es un número para indicar el número del grupo que se quiera usar. Como máximo pueden haber 100 grupos en el padrón

Otro ejemplo

let frase = "Este término #es importante#"

let cambio

let patron = /(#)([^#]+)(#)/g;

cambio = frase.replaceAll(patron, "<b>$2</b>");

console.log(cambio);

Ahora es importante aparece entre <b>y </b>..

La cadena de reemplazo puede usar más argumentos relativos al patrón o la cadena buscada

Patrón Inserta
$$ Inserta una "$".
$& subcadena coincidente.
$` La parte del string antes de la coincidencia
$' La parte del string después de la coincidencia
$n En patrones n es el número de orden de un grupo entre paréntesis

Fíjate como se puede cambiar el orden de palabras en una cadena

var nombre = "García Sánchez, Juan";

var invertir = nombre.replace(/(.*),(.*)/, "$2 ) ;

console.log(invertir)   //"Juan Garcia Sánchez"

El segundo parámetro en ambos métodos puede ser también el nombre de una función. Esta función es ejecutada cada vez que se encuentra una coincidencia con la expresión regular y va a recibir como parámetros:

  • El término encontrado en la expreg
  • Los grupos encontrados (sería lo correspondoiente a $1...
  • El índice donde se produce la coincidencia
  • La cadena completa
  • Los grupos de coincidencia

Estos son las argumentos máximos de la función.

Pero mejor un ejemplo sencillo. Este script cambia a mayúscula la inicial de cada palabra de la frase

let nombre = "hoy hace muy buen dia";

function cambiarMy(car){

     return car.toUpperCase();

}

let nueva = nombre.replaceAll(/\b(.)/ig, cambiarMy)

console.log(nueva);