Saltar al contenido

JavaScript Regex (OR)

Las expresiones regulares de JavaScript (RegEx) ofrecen capacidades potentes para la coincidencia de patrones dentro de cadenas. Uno de los componentes clave de RegEx es el operador OR, representado por la barra vertical (|). Este operador permite incluir múltiples patrones dentro de una sola expresión regular, lo que habilita búsquedas y manipulaciones de cadenas versátiles y eficientes. En esta guía completa, exploraremos el uso del operador OR en RegEx de JavaScript, acompañado de ejemplos prácticos para mejorar tu comprensión.

Comprender el Operador OR (|) en RegEx

El operador OR en las expresiones regulares te permite especificar múltiples alternativas para una coincidencia. Es particularmente útil cuando necesitas hacer coincidir un patrón entre varios posibles.

Uso Básico del Operador OR

La sintaxis del operador OR es sencilla. Consiste en colocar el símbolo | entre los patrones que deseas hacer coincidir.


Output appears here after Run.

En este ejemplo, el patrón /cat|dog/ coincide tanto con "cat" como con "dog" en las cadenas proporcionadas.

Agrupación con Paréntesis

Los paréntesis () se utilizan para agrupar partes de una expresión regular (para más información sobre grupos, consulta Grupos de Captura). Esto es útil cuando necesitas aplicar el operador OR a múltiples caracteres o patrones.


Output appears here after Run.

Aquí, el patrón /(cat|dog)s?/ coincide con "cat", "cats", "dog" y "dogs".

Ejemplos Prácticos

Coincidir con Diferentes Extensiones de Archivo

Supongamos que necesitas validar nombres de archivo con diferentes extensiones como .jpg, .png o .gif.


Output appears here after Run.

En este ejemplo, el patrón /\.(jpg|png|gif)$/ coincide con nombres de archivo que terminan en ".jpg", ".png" o ".gif".

Validación de Números de Teléfono

Considera un escenario en el que necesitas validar diferentes formatos de números de teléfono.


Output appears here after Run.

El patrón /(\+\d{1,2}\s?)?(\(\d{3}\)|\d{3})[-.\s]?\d{3}[-.\s]?\d{4}/ coincide con varios formatos de números de teléfono, incluidos aquellos con códigos de país, paréntesis, guiones, puntos y espacios.

Coincidir con Subpatrones Opcionales

El operador OR también se puede utilizar para hacer coincidir subpatrones opcionales dentro de una cadena.


Output appears here after Run.

Aquí, el patrón /color|colour/ coincide tanto con la ortografía estadounidense como con la británica de la palabra "color".

Combinar el Operador OR con Otros Metacaracteres

El poder del operador OR se potencia al combinarse con otros metacaracteres de expresiones regulares, como * (cero o más), + (uno o más), ? (cero o uno) y {} (exactamente n veces).

Ejemplo con Cuantificadores


Output appears here after Run.

El patrón /\b(cat|dog)s?\b/ coincide con "cat", "cats", "dog" y "dogs" como palabras completas, utilizando el metacaracter de límite de palabra \b.

Ejemplo Avanzado con Múltiples Condiciones


Output appears here after Run.

En este ejemplo, el patrón /(\d{1,2}-\d{1,2}-\d{4})|(\d{4}-\d{1,2}-\d{1,2})/ coincide con fechas en los formatos "MM-DD-YYYY" y "YYYY-MM-DD".

Conclusión

Dominar el operador OR en las expresiones regulares de JavaScript abre un amplio abanico de posibilidades para la coincidencia de patrones eficiente y versátil. Al comprender cómo usar el operador OR en combinación con otras características de RegEx, puedes crear patrones potentes y flexibles para manejar búsquedas y manipulaciones de cadenas complejas.

Practice

¿Cuál de las siguientes expresiones regulares utiliza correctamente el operador OR (|) para buscar las palabras 'cat' o 'dog'?

¿Te resulta útil?

Vista previa dual-run — compárala con las rutas Symfony en producción.