Cómo se usa
- Escribe o pega un patrón, como
^\d{3}-\d{4}$, o un literal completo como/colou?r/gi. - Si no pegaste un literal, escribe los flags en el cuadro Flags.
- Lee el árbol: a la izquierda cada parte del patrón y a la derecha lo que hace. Las filas sangradas pertenecen al grupo, la clase o el cuantificador de encima.
Cómo funciona
La herramienta analiza el patrón con la gramática de JavaScript: primero las alternativas separadas por |, luego los elementos con sus cuantificadores y, dentro, grupos, clases y escapes. Varios caracteres normales seguidos se muestran como un trozo de texto, salvo que los siga un cuantificador: en abc+ solo se repite la c, así que el árbol muestra el texto «ab» y luego «una o más veces» para la c.
Sin los flags u ni v, los navegadores aceptan algunas formas antiguas (una { o ] sueltas, un escape desconocido como \q que significa q), y el explicador también. Después del análisis el patrón se compila con new RegExp, así que nunca se explica como válido un patrón que JavaScript rechazaría.
Ejemplo
^(?<year>\d{4})-(0[1-9]|1[0-2])$ se lee así:
^el inicio del texto;(?<year>…)grupo de captura n.º 1 llamado «year»: exactamente 4 veces, un dígito del 0 al 9;-el carácter «-»;(…)grupo de captura n.º 2: una de 2 alternativas — el carácter «0» y un carácter de «1» a «9», o el carácter «1» y un carácter de «0» a «2»;$el final del texto.
Así acepta 2026-07 y 2026-12, pero no 2026-13.
Consejos
- Añade el flag m si ^ y $ deben funcionar en cada línea de un texto de varias líneas.
- El punto no coincide con saltos de línea salvo que añadas el flag s.
- Cuando la explicación coincida con lo que querías, prueba el patrón con texto real en el probador de regex.