Resumen: mostrar cómo hacer un replace y un replaceAll para remplazar caracteres en una string de JavaScript, ya sea solo la primera aparición o remplazar todas las apariciones; usando el método replace
y expresiones regulares.
Es importante mencionar que el método replace
devuelve una nueva cadena con los caracteres o letras remplazados; es decir, no modifica a la cadena internamente.
Vamos a usar el método replace. La sintaxis básica es:
cadena.replace(original, remplazo);
En donde original es una expresión regular o una cadena, y el remplazo es por lo que se remplaza.
Por defecto, el método replace
de JavaScript remplaza la primera ocurrencia. En caso de que haya más ocurrencias, no serán remplazadas.
Veamos el siguiente ejemplo:
let cadena = "PHP es un buen lenguaje, ¡me encanta PHP!";
let cadenaRemplazada = cadena.replace("PHP", "JavaScript");
console.log(`Cadena: ${cadena}.
Cadena remplazada: ${cadenaRemplazada}`);
/*
Salida:
Cadena: PHP es un buen lenguaje, ¡me encanta PHP!.
Cadena remplazada: JavaScript es un buen lenguaje, ¡me encanta PHP!
*/
Vamos a remplazar PHP por JavaScript, pero solo lo remplaza en la primera ocurrencia, no en la segunda. Si queremos remplazar todo, usemos una expresión regular.
Como replace
acepta una expresión regular, podemos usar simplemente el término e indicar la opción g
para decir que es global, es decir, que remplace todas las ocurrencias.
Así que en lugar de indicar la cadena "PHP"
ponemos una expresión regular /PHP/
y le agregamos la opción g
, así que queda como /PHP/g
let cadena = "PHP es un buen lenguaje, ¡me encanta PHP!";
let cadenaRemplazada = cadena.replace(/PHP/g, "JavaScript");
console.log(`Cadena: ${cadena}.
Cadena remplazada: ${cadenaRemplazada}`);
/*
====== Salida ======
Cadena: PHP es un buen lenguaje, ¡me encanta PHP!.
Cadena remplazada: JavaScript es un buen lenguaje, ¡me encanta JavaScript!
*/
No olvides que en realidad es una expresión regular y que si vas a usar caracteres significativos para la misma, los debes escapar con \
Por ejemplo, el símbolo [
indica la apertura de un rango, si lo quieres remplazar literalmente, indícalo con \[
¿Más sobre JavaScript moderno? míralo aquí.
Hoy te voy a presentar un creador de credenciales que acabo de programar y que…
Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…
En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…
En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…
Al usar Comlink para trabajar con los workers usando JavaScript me han aparecido algunos errores…
En este artículo te voy a enseñar cómo usar un "top level await" esperando a…
Esta web usa cookies.