Regex de JavaScript para probar, reemplazar y extraer texto

La regex de JavaScript compara texto con patrones para validar, extraer y reemplazar contenido. Cuando la entrada sigue un formato predecible, como fechas, IDs o códigos, una expresión regular puede verificarla o sacar solo las partes importantes. Los grupos de captura entre paréntesis aíslan subcadenas coincidentes, así un único patrón devuelve datos estructurados sin dividir strings manualmente.

Ejemplo de regex en JavaScript para extraer patrones

Salida:

Tiene fecha: true
Extraido: 2024/03/15
Reemplazado: Pedido #A-123 enviado el 2024/03/15

Cómo funciona este ejemplo

1. /(\d{4})-(\d{2})-(\d{2})/ define un literal regex que coincide con una fecha estilo ISO. \d{4} coincide con exactamente cuatro dígitos; los paréntesis crean grupos de captura para año, mes y día.
2. patronFecha.test(texto) devuelve true si el patrón coincide en cualquier parte del string, sin devolver detalles de la coincidencia.
3. texto.match(patronFecha) devuelve un array: la coincidencia completa en el índice 0, seguida por cada grupo de captura. Si no hay coincidencia, devuelve null, así que conviene validar antes de desestructurar cuando procesas entrada de usuario.
4. texto.replace(patronFecha, "$1/$2/$3") reemplaza la subcadena coincidente. $1, $2 y $3 insertan los grupos de captura (año, mes y día).

¿Qué es una expresión regular en JavaScript?

Una expresión regular en JavaScript es un objeto RegExp, también llamado regexp, usado para buscar combinaciones de caracteres en strings. Crea expresiones regulares con un literal (/patron/flags) o con el constructor RegExp (new RegExp("patron", "flags")). El motor recorre de izquierda a derecha y devuelve la primera coincidencia, salvo que esté activa la bandera global (g).

Errores comunes con regex en JavaScript

Usar una regex global con test o exec.

const re = /\d+/g;
console.log(re.test("abc 123")); // true
console.log(re.test("abc 123")); // false (lastIndex avanzó)
re.lastIndex = 0;
console.log(re.test("abc 123")); // true

Con g o y, test y exec tienen estado mediante lastIndex. Reinícialo o evita g para comprobaciones booleanas.

Olvidar el doble escape en new RegExp().

new RegExp("\d+");  // el patrón es "d+"
new RegExp("\\d+"); // uno o más dígitos

En un string literal, \\ produce una sola barra invertida, así el motor regex recibe \d en lugar de d.

Literal regex vs constructor RegExp

Usa un literal para patrones estáticos. Usa el constructor cuando el patrón incluya valores dinámicos, pero escapa antes la entrada del usuario para evitar inyección regex y metacaracteres accidentales.

const escapeRegExp = (value) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
const re = new RegExp(escapeRegExp("a+b?"), "i");

Más ejemplos

Reemplazar todas las apariciones con replaceAll:

const enmascarada = "tarjeta 4111-1111-1111-1111".replaceAll(/\d{4}/g, "****");
console.log(enmascarada); // "tarjeta ****-****-****-****"

replaceAll requiere la bandera g cuando el argumento de búsqueda es una regex; si omites g, lanza un TypeError.

Extraer todas las coincidencias con matchAll:

const etiquetas = [...("#js #regex #es2022".matchAll(/#(\w+)/g))];
console.log(etiquetas.map(m => m[1])); // ["js", "regex", "es2022"]

matchAll devuelve un iterador de arrays de coincidencia, cada uno con sus grupos de captura, así que expandirlo a un array te da acceso completo a todos los resultados.

FAQ

¿Cómo pruebas una regex en JavaScript?

Llama a regex.test(string) para obtener un resultado booleano, o a string.match(regex) para ver detalles de la coincidencia. Para múltiples coincidencias, usa string.matchAll(regex) con la bandera g, que devuelve un iterador con todos los arrays de coincidencia y sus grupos de captura.

¿JavaScript admite lookbehind assertions?

Sí. El lookbehind positivo (?<=...) y el lookbehind negativo (?<!...) funcionan en la mayoría de motores JavaScript modernos, pero navegadores antiguos y algunos runtimes embebidos pueden lanzar un error de sintaxis.

¿Cuándo debes usar new RegExp() en lugar de un literal?

Usa el constructor RegExp cuando el patrón no se conoce al escribir el código, por ejemplo al buscar términos ingresados por usuarios. En cualquier otro caso, prefiere un literal: evita el doble escape y permite que el motor reporte errores de sintaxis en parseo en lugar de en tiempo de ejecución.