Saltar al contenido

Explicador de expresiones regulares

Regex Explainer

Descompone una expresión regular en un árbol con etiquetas para que se lea qué captura cada parte.

Descompone una expresión regular en un árbol y dice qué hace cada pieza —cada grupo, cuantificador, clase y aserción, anidados como lo está el patrón—. Es la misma pantalla que el probador, abierta en su pestaña de explicación, porque leer un patrón y ejecutarlo son la misma actividad.

🔒 Se ejecuta por completo en tu navegadorregexexplainlearn
Vista

Patrón

//g

puede coincidir en cualquier punto de la cadena, 2 grupos de captura.

Qué hace cada parte

([\w.+-]+)@([\w-]+\.[\w.-]+)En orden

Cada una de estas cosas tiene que coincidir, una detrás de otra, sin nada en medio.

([\w.+-]+)Grupo de captura 1

Coincide con el patrón de dentro y recuerda el texto, disponible como `match[1]` y como `$1` en un reemplazo.

[\w.+-]+Repetido +

Repite una o más veces, lo más posible, y solo cede cuando el resto falla.

[\w.+-]Un carácter cualquiera de este conjunto

Coincide con exactamente un carácter, el primero de los siguientes que aparezca en la entrada.

Dentro de una clase, `.` es un punto. Aquí no significa «cualquier carácter», y escaparlo no cambia nada.

\wCualquier carácter de palabra

Exactamente `[A-Za-z0-9_]`.

Esto es solo ASCII. Para una expresión regular de JavaScript, `é`, `한` y `ß` no son caracteres de palabra, así que `\w+` no coincide con una palabra coreana ni acentuada.

.El carácter “.” (U+002E)

Se compara exactamente, mayúsculas y minúsculas incluidas.

+El carácter “+” (U+002B)

Se compara exactamente, mayúsculas y minúsculas incluidas.

-El carácter “-” (U+002D)

Se compara exactamente, mayúsculas y minúsculas incluidas.

@El carácter “@” (U+0040)

Se compara exactamente, mayúsculas y minúsculas incluidas.

([\w-]+\.[\w.-]+)Grupo de captura 2

Coincide con el patrón de dentro y recuerda el texto, disponible como `match[2]` y como `$2` en un reemplazo.

[\w-]+\.[\w.-]+En orden

Cada una de estas cosas tiene que coincidir, una detrás de otra, sin nada en medio.

[\w-]+Repetido +

Repite una o más veces, lo más posible, y solo cede cuando el resto falla.

[\w-]Un carácter cualquiera de este conjunto

Coincide con exactamente un carácter, el primero de los siguientes que aparezca en la entrada.

\wCualquier carácter de palabra

Exactamente `[A-Za-z0-9_]`.

Esto es solo ASCII. Para una expresión regular de JavaScript, `é`, `한` y `ß` no son caracteres de palabra, así que `\w+` no coincide con una palabra coreana ni acentuada.

-El carácter “-” (U+002D)

Se compara exactamente, mayúsculas y minúsculas incluidas.

\.El carácter “.” (U+002E)

Se compara exactamente, mayúsculas y minúsculas incluidas.

La barra invertida sobra aquí: en esta posición, este carácter no tiene ningún significado especial.

[\w.-]+Repetido +

Repite una o más veces, lo más posible, y solo cede cuando el resto falla.

[\w.-]Un carácter cualquiera de este conjunto

Coincide con exactamente un carácter, el primero de los siguientes que aparezca en la entrada.

Dentro de una clase, `.` es un punto. Aquí no significa «cualquier carácter», y escaparlo no cambia nada.

\wCualquier carácter de palabra

Exactamente `[A-Za-z0-9_]`.

Esto es solo ASCII. Para una expresión regular de JavaScript, `é`, `한` y `ß` no son caracteres de palabra, así que `\w+` no coincide con una palabra coreana ni acentuada.

.El carácter “.” (U+002E)

Se compara exactamente, mayúsculas y minúsculas incluidas.

-El carácter “-” (U+002D)

Se compara exactamente, mayúsculas y minúsculas incluidas.

Banderas

g — global
Encuentra todas las coincidencias en lugar de parar en la primera. A cambio, `.test()` y `.exec()` van moviendo `lastIndex` entre llamadas, que es el origen habitual de «una llamada sí y otra no».

Cómo se usa

  1. Pega el patrón que heredaste

    El del archivo de configuración que nadie recuerda haber escrito. Se analiza en lugar de reconocerse por patrones, así que el desglose sigue la estructura real.

  2. Lee el árbol hacia abajo

    Cada nodo muestra el fragmento de origen, qué es y qué hace. Las notas señalan las partes que suelen sorprender: un cuantificador anidado, un grupo que captura cuando no hacía falta.

  3. Cambia a Probar para comprobar tu lectura

    El patrón se lleva consigo. Entender una regex y confirmar que hace lo que crees son dos pasos distintos, y el segundo es el barato.

Preguntas frecuentes

¿Qué significa la advertencia sobre un cuantificador anidado?

Algo como `(a+)+` le da al motor un número exponencial de formas de partir el mismo texto, así que una entrada que no coincide puede tardar más que la edad del universo. Es la forma que hay detrás de la mayoría de las denegaciones de servicio por expresión regular.

¿Por qué me dice que un grupo es de captura?

Porque un grupo de captura que no usas cuesta un hueco y desplaza la numeración de los que sí usas. `(?:…)` agrupa sin capturar, lo que mantiene `$1` apuntando a lo que querías.

¿Explica también los flags?

Sí, en un panel propio: cada flag que hayas activado, su nombre y qué cambia. `m` y `s` en particular merecen leerse, porque sus nombres sugieren el comportamiento del otro.

Puede recibir de

Después

Estas aceptan lo que produce esta herramienta, así que el resultado puede pasar directamente.