W3docs

Cuantificadores Regex y Saltos de Línea en JavaScript

Tutorial avanzado de JavaScript sobre el uso de cuantificadores en expresiones regulares y el carácter especial de salto de línea.

En esta guía, exploraremos los potentes cuantificadores que te ayudan a gestionar cuántas veces debe aparecer un patrón en tus búsquedas de texto. ¡Profundicemos y descubramos el potencial de los cuantificadores regex para hacer tu código más eficiente y efectivo!

Comprender los Cuantificadores en las Expresiones Regulares de JavaScript

Los cuantificadores en las expresiones regulares son herramientas poderosas que te permiten especificar cuántas veces debe aparecer un carácter, grupo o clase de caracteres en la cadena de entrada para que coincida. Aquí tienes un resumen rápido de los cuantificadores más utilizados en JavaScript:

  • * (asterisco): Coincide con 0 o más repeticiones del elemento anterior.
  • + (más): Coincide con 1 o más repeticiones del elemento anterior.
  • ? (signo de interrogación): Coincide con 0 o 1 repetición del elemento anterior.
  • {n}: Coincide exactamente con n ocurrencias del elemento anterior.
  • {n,}: Coincide con al menos n ocurrencias del elemento anterior.
  • {n,m}: Coincide entre n y m ocurrencias del elemento anterior, ambos inclusive.

Un cuantificador siempre se aplica al único elemento que tiene directamente delante: un carácter, un escape como \d, una clase de caracteres como [a-z], o un grupo como (abc). Nunca se aplica a todo el patrón a la vez.

Ejemplo práctico: Uso del cuantificador *

javascript— editable

En este ejemplo, /A*/i coincide con cero o más ocurrencias de 'A' (sin distinción de mayúsculas/minúsculas), capturando la secuencia "Aaaaaa" al inicio de la cadena. El asterisco permite la coincidencia incluso si 'A' está ausente.

Ejemplo práctico: Uso del cuantificador +

javascript— editable

La expresión \d+ encuentra uno o más dígitos en el texto. El resultado incluye 123 y 456 como coincidencias separadas, mostrando la utilidad de + para capturar números completos.

Ejemplo práctico: Uso del cuantificador ?

javascript— editable

El patrón regex /colou?r/g coincide tanto con "color" como con "colour". El cuantificador ? hace opcional la 'u' precedente, permitiendo que el patrón coincida con la palabra independientemente de si la 'u' está presente. La bandera g garantiza que se encuentren todas las ocurrencias en el texto.

Ejemplo práctico: Uso del cuantificador {n}

javascript— editable

\b\d{4}\b coincide con una secuencia de exactamente cuatro dígitos, reconociendo 2022 y 1999 como años.

Información

Considera siempre la eficiencia de tus expresiones regulares. Los patrones ineficientes pueden causar un rendimiento lento, especialmente con grandes conjuntos de datos. Optimiza tu regex evitando cuantificadores innecesarios y usando cuantificadores no codiciosos cuando sea aplicable.

Ejemplo práctico: Uso del cuantificador {n,}

javascript— editable

El patrón \b[a-zA-Z]{5,}\b coincide con palabras que constan de al menos cinco letras. Esto capturará fantastic e incredible.

Ejemplo práctico: Uso del cuantificador {n,m}

javascript— editable

El patrón regex \b[a-zA-Z]{3,6}\b está diseñado para coincidir con palabras que contengan entre 3 y 6 letras, delimitadas por límites de palabra para garantizar que solo se coincidan palabras completas. El regex captura "See", "the", "big", "tiny", "ant", "and", "old" y "tree". No coincide con "elephant" porque supera las 6 letras.

Ejemplo práctico: Uso del carácter \n

javascript— editable

La secuencia de escape \n representa un carácter de salto de línea. En una expresión regular, coincide con el salto de línea real en la cadena. El patrón /line\n/g encuentra la palabra "line" seguida inmediatamente de un salto de línea, capturando ambas instancias del ejemplo.

Los Cuantificadores Abreviados Son Solo {n,m}

Los símbolos *, + y ? no son más que abreviaturas convenientes de la forma {n,m}. Conocer las equivalencias los hace más fáciles de recordar:

  • * es lo mismo que {0,} — cero o más.
  • + es lo mismo que {1,} — uno o más.
  • ? es lo mismo que {0,1} — cero o uno.
javascript— editable

Ambos patrones en cada par producen el mismo resultado, confirmando que los símbolos y las formas con llaves son intercambiables.

Los Cuantificadores Son Codiciosos por Defecto

Por defecto, un cuantificador es codicioso: toma tanto de la cadena como puede mientras el patrón general siga coincidiendo. Por eso un patrón como <.+> absorbe todo desde el primer < hasta el último >, no el primero.

javascript— editable

Para detenerse en el primer > en su lugar, añade un ? después del cuantificador para hacerlo perezoso (no codicioso): <.+?>. Los cuantificadores perezosos se tratan en profundidad en Cuantificadores Codiciosos y Perezosos.

Aplicar Cuantificadores a Grupos y Clases de Caracteres

Un cuantificador repite únicamente el token individual que tiene delante. Para repetir varios caracteres como una unidad, envuélvelos en un grupo de captura con (...). Para repetir cualquiera de un conjunto de caracteres, coloca el cuantificador después de una clase de caracteres [...].

javascript— editable

El primer patrón repite la secuencia completa (abc) dos veces; sin el grupo, abc{2} solo repetiría la c final. El ejemplo hexadecimal repite la clase [0-9a-f] seis veces, y el ejemplo del teléfono combina un grupo repetido con {n} sobre \d.

Para controlar si las coincidencias distinguen mayúsculas/minúsculas o abarcan múltiples líneas, combina los cuantificadores con las banderas apropiadas descritas en Patrones y Banderas.

Conclusión

Comprender y utilizar eficazmente los cuantificadores y el carácter \n en JavaScript puede mejorar significativamente tus capacidades de manipulación de texto en el desarrollo web. Estas herramientas permiten una búsqueda de patrones y extracción de datos potentes, haciendo tu código JavaScript más eficiente y tus aplicaciones más dinámicas y responsivas.

Práctica

Práctica
En JavaScript, ¿qué hace el cuantificador '+' cuando se usa en una expresión regular?
En JavaScript, ¿qué hace el cuantificador '+' cuando se usa en una expresión regular?
Was this page helpful?