4Geeks logo
4Geeks logo

Bootcamps

Explora nuestra extensa colección de cursos diseñados para ayudarte a dominar varios temas y habilidades. Ya seas un principiante o un aprendiz avanzado, aquí hay algo para todos.

Academia

Aprende en vivo

Únete a nosotros en nuestros talleres gratuitos, webinars y otros eventos para aprender más sobre nuestros programas y comenzar tu camino para convertirte en desarrollador.

Próximos eventos en vivo

Catálogo de contenidos

Para los geeks autodidactas, este es nuestro extenso catálogo de contenido con todos los materiales y tutoriales que hemos desarrollado hasta el día de hoy.

Tiene sentido comenzar a aprender leyendo y viendo videos sobre los fundamentos y cómo funcionan las cosas.

Full-Stack Software Developer - 16w

Data Science and Machine Learning - 16 wks

Buscar en lecciones


IngresarEmpezar
← Regresar a lecciones

Weekly Coding Challenge

Todas las semanas escogemos un proyecto de la vida real para que construyas tu portafolio y te prepares para conseguir un trabajo. Todos nuestros proyectos están construidos con ChatGPT como co-pilot!

Únete al reto

Podcast: Code Sets You Free

Un podcast de cultura tecnológica donde aprenderás a luchar contra los enemigos que te bloquean en tu camino para convertirte en un profesional exitoso en tecnología.

Escuchar el podcast
Editar en Github

Tutorial de Regex: Aprender con ejemplos de expresiones regulares

¿Qué es una Expresión Regular (Regex)?
La Sintaxis de los Patrones

¿Qué es una Expresión Regular (Regex)?

Básicamente, una expresión regular es un patrón que describe una cierta cantidad de texto. Por ejemplo, sabes que los correos electrónicos son siempre como:

username@domain.extension

Si queremos describir el patrón de un correo electrónico, diríamos algo como esto: Comenzando con un nombre de usuario (una combinación de letras y números), seguido de un símbolo arroba @, seguido del dominio (otra combinación de letras y números) seguido de la extensión (que comienza con un punto . seguido de una combinación de letras solamente).

El proceso de describir el patrón de un correo electrónico es el mismo proceso que seguirá cuando desee crear una expresión regular. La única diferencia será la sintaxis.

¿Por qué Usar Regex?

Todos los principales lenguajes de programación utilizan expresiones regulares (C ++, PHP, .NET, Java, JavaScript, Python, Ruby y muchos otros). Como desarrollador web, siempre debes trabajar con strings para validar los datos ingresados por el usuario, validar formatos de URL, reemplazar palabras en párrafos, etc. Estos son los usos principales de las expresiones regulares:

  • Buscar elementos particulares dentro de un gran texto. Por ejemplo, es posible que desees identificar todas las direcciones de correo electrónico en algún contenido mediante un editor de texto.
  • Reemplazar artículos particulares. Por ejemplo, es posible que desees limpiar un poco de HTML con formato deficiente reemplazando todas las etiquetas en mayúsculas con equivalentes en minúsculas en un editor de texto.
  • Validar entradas. Por ejemplo, puedes querer verificar que una contraseña cumpla con ciertos criterios, tales como: una combinación de mayúsculas y minúsculas, dígitos, signos de puntuación, etc., en un programa que estés escribiendo.
  • Coordinar acciones. Por ejemplo, es posible si quieres procesar ciertos archivos en un directorio, pero solo si cumplen condiciones particulares. En el trabajo lo estás haciendo en la línea de comando.
  • Reformatear el texto. Por ejemplo, puedes exportar datos de un programa como un archivo de texto, luego modificar tu diseño para que puedas importarlo en otro programa usando un editor de texto.
  • y más…

Construyendo y probando expresiones regulares

Nunca comiences a crear un Regex sin tener una herramienta de prueba en vivo, ya que puede complicarse con mucha facilidad. La mejor manera es usar la estrategia "divide y vencerás" (otra vez): divide tu Regex en varios Regex más pequeños, y luego combínalos todos.

La Sintaxis de los Patrones

Esta es una expresión regular que busca un patrón de correo electrónico:

1/[\w._%+-]+@[\w.-]+\.[a-zA-Z]{2,4}/

Pero, no te preocupes ... no tienes que entenderlo ahora. La buena noticia es que una expresión regular compleja es simplemente la combinación de varias expresiones regulares muy simples. "¡Divide y vencerás!"

Entonces ... comencemos con las expresiones regulares básicas utilizando los operadores más básicos:

Caractéres simples

Un caracter simple es…

Cualquier sucesión de caracteres es una simple expresión regular. Si usamos la palabra "email" (correo electrónico) como una expresión regular, el sistema buscará cualquier repetición de la palabra "email" dentro del texto dado.

Usa el contenedor de la derecha para jugar con otras sucesiones simples de caracteres.

Click para abrir demo en una nueva ventana

El Caracter .

El caracter . representa…

Cualquier caracter o símbolo disponible. Si dices ab.ve, estás diciendo algo que comienza con ab y termina con ve

Puedes usar el . tantas veces como quieras; la expresión regular reemplazará el . con cualquier carácter tantas veces como aparezca el .

Usa el contenedor de la derecha para jugar con otras sucesiones simples de caracteres.

El Caracter Rango [ ]

El caracter [ ] representa…

Un grupo de posibles caracteres. A veces, nos gustaría ser un poco más específicos... aquí es donde los rangos son útiles. Especificamos un rango de caracteres encerrándolos entre corchetes ([]).

También puede usar el [] para alinear números o letras con un guión intermedio. El guión representa un rango de números o caracteres. Por ejemplo:

  • [0-9] representa cualquier número entre 0 y 9.
  • [a-z] representa cualquier letra en minúscula
  • [A-Z] Representar cualquier letra en mayúsculas.

También puedes combinar rangos de caracteres de esta forma:

  • Cualquier letra en mayúsculas o minúsculas: [a-zA-Z]
  • Números del 1 al 5 y también del 9: [1-59]
  • Números del 1 al 5, letras de la a la f y también la X mayúscula:[1-5a-fX]

El caracter ^ (simbolo de intercalación): Negación o comienzo de un término

Si colocamos ^ al comienzo de un [rango]:

Estamos negando el rango. Por ejemplo:

  • Todos los términos que comienzan con li y terminan con e pero no tienen i o v en el interior: li [^ v] e

Si colocamos ^ al comienzo de una expresión regular:

  • Estamos diciendo que solo queremos probar el Regex desde el principio del string (no se evaluarán los substrings - partes más pequeñas de la cadena):

  • Un string que comienza con http: ^http

Atajos para los dígitos \d y Palabras \w

Si lo prefieres, puedes usar estos accesos directos en tus expresiones regulares:

OperadorDescripción
\wCoincide con cualquier caracter de palabra (igual a [a-zA-Z0-9_])
\WCoincide con cualquier otra cosa que no sea una letra, dígito o subrayado
\dCoincide con cualquier dígito decimal. Equivalente a [0-9]
\DCoincide con cualquier cosa que no sea un dígito decimal

Agrupar o encerrar expresiones regulares con ()

Siempre hablamos de "divide y vencerás", ¿verdad? Bueno, tu mejor amigo para eso será el operador de paréntesis (). Ahora podemos agrupar cualquier patrón como lo hacemos en matemáticas.

Ahora que podemos agrupar, podemos multiplicar (repetir) nuestros patrones, negarlos, etc.

Por ejemplo, este Regex acepta una o muchas repeticiones del string ab seguido de una letra c al final: (ab) * c

Usando el cuantificador en expresiones regulares

A veces, no desea especificar el número de caracteres que puede tener un Regex. Por ejemplo, un nombre de dominio puede tener entre 1 y quizás 100 caracteres ... ¿quién sabe?

El cuantificador nos permite aumentar el número de veces que un caracter puede aparecer en nuestra expresión regular. Aquí está el conjunto básico de multiplicadores:

  • * – el caracter ocurre cero o más veces.
  • + – el caracter ocurre una o más veces.
  • ? – el caracter ocurre cero o una vez.
  • {5} – el caracter ocurre cinco veces.
  • {3,7} – el caracter ocurre entre 3 y 7 veces.
  • {2,} – el caracter aparece al menos 2 veces.

Usando el cuantificador en * + ?

Podemos colocar el cuantificador después de los patrones de caracteres que queremos repetir. Aquí hay algunos casos y ejemplos:

OperadorDescripción
+Uno o varios Por ejemplo:
Términos con la letra o al menos una vez; o +
*Cero o muchos
Por ejemplo, los términos que comienzan con la letra "a" (en minúsculas) seguidos de cero o muchos caracteres de cualquier tipo, excepto el espacio en blanco: a [^] *
?Cero o uno. Por ejemplo: Buscar el string de noviembre con o sin el método abreviado: [nN] ov (ember)?

☝️ Aquí hay dos herramientas increíbles para construir y probar expresiones regulares. https://regex101.com/ and http://regexr.com/

☝️Aquí hay un tutorial interactivo para aprender expresiones regulares: https://regexone.com/

Algunas Expresiones Regulares muy útiles

Afrontémoslo: las expresiones regulares son algo que utilizarás de vez en cuando (a menos que te especialices en un área muy particular del mundo del desarrollo web). La sintaxis es fácil de olvidar y es probable que encuentres tu Regex en Internet la mayor parte del tiempo. Lo importante aquí es que los entiendas y que puedas jugar con ellos cuando lo necesites.

Aquí hay algunos Regex pre-hechos:

Expresión regular para: validar un correo electrónico

regex tutorial regular expression examples

Comenzamos diciéndole al analizador que encuentre el principio de la cadena (^).

Dentro del primer grupo, unimos una o más letras minúsculas, números, guiones bajos, puntos o guiones.

Hemos escapado del punto porque un punto no escapado significa cualquier caracter.

Directamente después de eso, debe haber un signo @.

El siguiente es el nombre de dominio, que debe ser: una o más letras minúsculas, números, guiones bajos, puntos o guiones. Luego otro punto (escapado), con la extensión de dos a seis letras o puntos. Tengo 2 a 6 debido a los TLD específicos del país (.ny.us o .co.uk).

Finalmente, queremos el final de la cadena ($).

Expresión Regular para: coincidir con una URL

Este Regex es casi como tomar la parte final del Regex anterior, colocándolo entre "http: //" y alguna estructura de archivos al final. Suena mucho más simple de lo que realmente es. Para empezar, debemos buscar el comienzo de la línea con el cursor.

El primer grupo de captura es completamente opcional. Permite que la URL comience con "http: //", "https: //", o con ninguno de ellos. Tenemos un signo de interrogación después de la s para permitir las URL que tienen http o https. Para que este grupo completo sea opcional, acabamos de agregar un signo de interrogación al final.

El siguiente es el nombre de dominio: uno o más números, letras, puntos o guiones seguidos de otro punto, luego de dos a seis letras o puntos. La siguiente sección es los archivos y directorios opcionales. Dentro del grupo, queremos hacer coincidir cualquier número de barras diagonales, letras, números, guiones bajos, espacios, puntos o guiones. Entonces diremos que este grupo puede combinarse tantas veces como queramos. Esto permite hacer coincidir varios directorios junto con un archivo al final. Hemos usado la estrella en lugar del signo de interrogación porque la estrella dice cero o más, no cero o uno. Si se utilizara un signo de interrogación allí, solo se podría hacer coincidir un archivo / directorio.

A continuación, se hace coincidir una barra diagonal, pero es opcional.

Finalmente, terminamos con el final de la línea.