Probador de Regex — Probador en línea de expresiones regulares de JavaScript _

¿Cómo funciona regex en tu navegador?

Cada entorno de ejecución JavaScript incorpora un motor nativo de expresiones regulares — new RegExp(pattern, flags) compila tu patrón, y luego métodos como String.prototype.match, String.prototype.replace y RegExp.prototype.exec lo ejecutan contra cualquier cadena de entrada. Este probador envuelve ese motor en una interfaz para que puedas editar, ejecutar e inspeccionar patrones sin salir del navegador. Nada de lo que escribes — patrón, banderas, cadena de prueba o reemplazo — se envía por la red.

¿Cómo funciona el probador de regex?

La canalización son unos pocos pasos cortos, todos ejecutándose del lado del cliente en cada pulsación (con un debounce de 150 ms para que escribir siga siendo fluido):

1. El cuerpo de tu patrón se lee del campo de arriba (sin delimitadores / al inicio o al final — son decorativos). Las banderas seleccionadas se concatenan en una cadena como gi o gimsuy.
2. new RegExp(patternBody, flags) compila el patrón. Si el motor lanza un SyntaxError (p. ej. un paréntesis no emparejado o un escape no válido), el mensaje se muestra sobre la cadena de prueba y la lista de coincidencias se borra. El error de compilación es el err.message real de V8 / SpiderMonkey / JavaScriptCore, así que coincide con lo que verías en DevTools.
3. Para la lista de coincidencias, el probador siempre enumera con una bandera global sintética — así, aunque desactives g, la lista sigue mostrando todas las coincidencias. La protección estándar contra coincidencias de ancho cero (if (m.index === rx.lastIndex) rx.lastIndex++) evita que el bucle se atasque en patrones que coinciden con una cadena vacía. El modo Reemplazo respeta tu conjunto real de banderas, así que $& se comporta igual que String.prototype.replace.
4. Entre cada iteración, el probador comprueba performance.now() - start y aborta cuando han pasado 50 ms. Esto protege contra el retroceso catastrófico en entradas como (a+)+$ contra una larga secuencia de a — la pestaña, de otro modo, se colgaría. La protección es de mejor esfuerzo: un patrón patológico de coincidencia única todavía puede consumir tiempo dentro de una sola llamada exec. Si eso ocurre, refresca la pestaña y reescribe el patrón con un cuantificador no codicioso o un estilo posesivo atómico (p. ej. [^x]*x).
5. La cadena de prueba se divide en segmentos por el rango de cada coincidencia y los segmentos coincidentes se envuelven en elementos <mark class="rx-match rx-cap-N">, donde N recorre cíclicamente seis colores de paleta para que las coincidencias adyacentes sean fáciles de distinguir de un vistazo. Los grupos numerados (m[1], m[2], …) y los grupos con nombre (m.groups) de cada coincidencia se muestran como filas etiquetadas debajo; si la bandera d está activa, también se muestran los índices [start, end] por grupo.

¿Por qué usar este probador de regex?

• Privacidad: cada patrón, cadena de prueba y reemplazo se ejecuta en tu navegador usando el motor JavaScript RegExp incorporado. Nada sale de la pestaña — importante cuando la entrada es un log de cliente, un patrón de credencial filtrada o cualquier otra cosa que no pegarías en un patio de regex SaaS alojado.
• Sabor honesto: el probador expone exactamente el motor de regex que ejecutan Node.js, Chrome, Safari, Firefox y todo validador de formularios basado en el navegador. No hay una capa de traducción al sabor Perl que oculte diferencias sutiles — lo que funciona aquí funciona en tu código.
• Depuración de captura y grupos con nombre: cada grupo numerado ($1, $2, …) y cada grupo con nombre ($<year>) se muestra por coincidencia, así que puedes construir un parser y leer las ranuras sin adivinar. El modo Reemplazo te permite combinar grupos libremente — $2-$1 intercambia las dos primeras ranuras, $<name> inserta una ranura con nombre y $& reproduce la coincidencia completa.
• Protección contra retroceso catastrófico: un techo de 50 ms en la enumeración aborta patrones patológicos como (a+)+$ antes de que congelen la pestaña. Ves un error explicativo en lugar de un navegador colgado, y la página se recupera de inmediato.

¿Cuáles son las aplicaciones comunes de un probador de regex?

Las expresiones regulares aparecen en el desarrollo web, la seguridad y el trabajo con datos — este probador apunta a los casos de uso más comunes:

• Validación de formularios: prototipa un patrón de email, teléfono o código postal, pega entradas de muestra en la cadena de prueba y confirma que cada caso positivo coincide y cada caso negativo no antes de enviar el patrón al código de producción.
• Análisis de logs: pega un fragmento de salida de NGINX, de aplicación o de auditoría, escribe un patrón con grupos con nombre para las partes que te interesan ((?<ip>…) (?<path>…)) y lee las ranuras capturadas por coincidencia para confirmar que tu parser es correcto.
• Buscar y reemplazar para refactor: usa el modo Reemplazo para reescribir identificadores en un fragmento — (\w+)\.set(\w+)\( → $1.$2 = convierte llamadas a setters en asignaciones de propiedades, y la vista previa en vivo muestra el resultado antes de aplicarlo en un codemod.

¿Cómo se ve un ejemplo de regex?

Toma el patrón (\d{4})-(\d{2})-(\d{2}) con la bandera g, ejecutado contra la cadena de prueba release 2025-11-15, prerelease 2026-05-25. El motor encuentra dos coincidencias. La primera es 2025-11-15 con grupo 1 = 2025, grupo 2 = 11, grupo 3 = 15. La segunda es 2026-05-25 con la misma forma de grupos. En modo Reemplazo, la plantilla $3/$2/$1 reescribe ambas fechas como 15/11/2025 y 25/05/2026 — una conversión ISO a DMY de un solo patrón que puedes verificar visualmente antes de enchufar el patrón en un script.

Usa este probador como la vía rápida para cualquier trabajo de regex — construir, depurar o reescribir patrones. Todo se ejecuta localmente; nada se registra; el motor de regex es el que tu navegador incluye, así que el comportamiento coincide con lo que el código de producción verá en tiempo de ejecución.