La Aventura de Aprender > Programación > Javascript > DOM > ¿Qué es una expresión regular?

Print Friendly, PDF & Email

¿Qué es una expresión regular?

Autor:

ciberkaos

– Tema:

– Publicado:

– Actualizado:

Una expresión regular (RegExp) es un patrón que se utiliza para buscar, validar o extraer texto dentro de una cadena.

Piensa en ellas como:

🔎 Un detector de patrones dentro del texto.

Sirven para:

  • Validar formularios (email, DNI, teléfono…)
  • Buscar palabras en textos
  • Reemplazar partes de una cadena
  • Extraer información estructurada

2. Cómo se escriben en JavaScript

En JavaScript existen dos formas:

Forma literal (la más común)

let regex = /patron/;

Con el constructor RegExp

let regex = new RegExp("patron");

En clase usaremos principalmente la forma literal porque es más clara.

3. Métodos principales para usar expresiones regulares

test()

Devuelve true o false.

let texto = "Hola mundo";
let regex = /Hola/;
console.log(regex.test(texto)); // true

match()

Devuelve coincidencias.

let texto = "Tengo 2 perros y 3 gatos";
let regex = /\d/g;
console.log(texto.match(regex)); // ["2", "3"]

\d significa “digit”, es decir, cualquier número del 0 al 9.
Es equivalente a escribir:

/[0-9]/

Segundo: la barra / /

Las barras indican que lo que hay dentro es una expresión regular.

Tercero: la g

La g es una bandera (flag) que significa global.
Le dice al motor:

«No te quedes con la primera coincidencia. Busca todas.»

replace()

Permite reemplazar coincidencias.

let texto = "Hola mundo";
let regex = /mundo/;
console.log(texto.replace(regex, "Antonio"));
// Hola Antonio

4. Sintaxis básica (los símbolos importantes)

Aquí empieza la magia real.

Texto literal

/Hola/

Busca exactamente “Hola”.

. (punto)

Representa cualquier carácter excepto salto de línea.

/h.la/

Coincide con:

  • hola
  • hXla
  • h9la

\d

Representa un número (0–9).

/\d/

\w

Representa letra, número o guion bajo.

\s

Representa espacio en blanco.

5. Cuantificadores (cuántas veces aparece algo)

*

Cero o más veces.

/ho*/

Coincide con:

  • h
  • ho
  • hoo
  • hooooo

+

Una o más veces.

/ho+/

Coincide con:

  • ho
  • hoo
  • hooo

No coincide con solo “h”.

?

Cero o una vez.

{n}

Exactamente n veces.

/\d{3}/

Tres números seguidos.

{n,m}

Entre n y m veces.

/\d{2,4}/

Entre 2 y 4 números seguidos.

6. Grupos y alternativas

Paréntesis ()

Permiten agrupar.

/(hola)+/

|

Equivale a “o”.

/(perro|gato)/

Coincide con:

  • perro
  • gato

7. Anclas (inicio y fin)

^

Inicio de texto.

/^Hola/

$

Fin de texto.

/mundo$/

8. Banderas (modificadores)

Se colocan al final:

/patron/g

g → global

Busca todas las coincidencias.

i → ignore case

Ignora mayúsculas/minúsculas.

m → multiline

Ejemplo:

/hola/i

Coincide con:

  • hola
  • Hola
  • HOLA

9. Casos prácticos reales

Validar un email simple

let email = "usuario@email.com";
let regex = /^[\w.-]+@[\w.-]+\.\w{2,}$/;
console.log(regex.test(email));

Explicación simplificada:

  • Texto antes del @
  • @
  • Dominio
  • Punto
  • Extensión de al menos 2 letras

Validar un número de teléfono español (9 dígitos)

let telefono = "612345678";
let regex = /^[6-9]\d{8}$/;
console.log(regex.test(telefono));

Extraer números de un texto

let texto = "Pedido 123 con código 456";
let regex = /\d+/g;
console.log(texto.match(regex));

10. Patrón mental para entenderlas

Una expresión regular siempre responde a 3 preguntas:

  1. ¿Qué estoy buscando?
  2. ¿Cuántas veces debe aparecer?
  3. ¿Dónde debe estar (inicio, fin, en cualquier parte)?

Si los alumnos entienden eso, ya dominan el 80%.

11. Errores comunes

  • Olvidar la bandera g
  • No escapar caracteres especiales como .
  • Confundir * con +
  • No usar ^ y $ en validaciones

12. Recomendación para practicar

Sitios útiles:

Permiten probar en tiempo real.

Ejemplos

1️⃣ Detectar si un texto contiene números

function contieneNumeros(texto) {
    let regex = /\d/;
    return regex.test(texto);
}console.log(contieneNumeros("Hola mundo"));     // false
console.log(contieneNumeros("Hola 2026"));      // true

Aquí usamos test() porque solo queremos verdadero o falso.

2️⃣ Extraer todos los números de un texto

function extraerNumeros(texto) {
    let regex = /\d+/g;
    return texto.match(regex);
}console.log(extraerNumeros("Pedido 123 y código 456"));
// ["123", "456"]

Aquí usamos \d+ porque queremos números completos, no dígitos sueltos.

3️⃣ Validar un email sencillo

No vamos a hacer el monstruo RFC de 3 kilómetros. Algo razonable para clase.

function validarEmail(email) {
    let regex = /^[\w.-]+@[\w.-]+\.\w{2,}$/;
    return regex.test(email);
}
console.log(validarEmail("antonio@email.com")); // true
console.log(validarEmail("antonio@email"));     // false

Observa el uso de ^ y $ para asegurar que coincide TODO el texto.

4️⃣ Validar teléfono español (9 cifras empezando por 6, 7, 8 o 9)

function validarTelefono(telefono) {
    let regex = /^[6-9]\d{8}$/;
    return regex.test(telefono);
}
console.log(validarTelefono("612345678")); // true
console.log(validarTelefono("123456789")); // false

Aquí enseñamos:

  • [6-9] → rango
  • \d{8} → exactamente 8 números
  • ^ y $ → validación completa

5️⃣ Extraer hashtags de un texto

function extraerHashtags(texto) {
    let regex = /#\w+/g;
    return texto.match(regex);
}
console.log(extraerHashtags("Aprendiendo #JavaScript y #Regex"));
// ["#JavaScript", "#Regex"]

Aquí aparece algo interesante: # es literal, pero \w+ captura letras y números después.

6️⃣ Validar contraseña básica

Condiciones:

  • mínimo 8 caracteres
  • al menos una mayúscula
  • al menos un número
function validarPassword(password) {
    let regex = /^(?=.*[A-Z])(?=.*\d).{8,}$/;
    return regex.test(password);
}
console.log(validarPassword("Hola1234"));   // true
console.log(validarPassword("hola1234"));   // false

Aquí introduces algo más avanzado:
(?=...) → lookahead positivo.

Es como decir:

“Antes de aceptar esto, asegúrate de que en algún lugar hay una mayúscula y un número.”

Es un nivel más pro, pero abre la puerta a conversaciones interesantes.

7️⃣ Reemplazar espacios múltiples por uno solo

function limpiarEspacios(texto) {
    let regex = /\s+/g;
    return texto.replace(regex, " ");
}
console.log(limpiarEspacios("Hola    mundo    cruel"));
// "Hola mundo cruel"

Elementos para construir una Expresión Regular (JavaScript)

ElementoSímbolo¿Qué hace?EjemploCoincide con
Texto literalholaBusca exactamente ese texto/hola/hola
Cualquier carácter.Cualquier carácter excepto salto de línea/h.la/hola, h9la
Número\dUn dígito (0-9)/\d/5
No número\DCualquier cosa que NO sea número/\D/a, #
Letra/número/_\wCarácter alfanumérico o _/\w/a, 3, _
No alfanumérico\WLo contrario de \w/\W/@, #
Espacio\sEspacio, tabulación, salto de línea/\s/» «
No espacio\SCualquier cosa que no sea espacio/\S/a

📌 Cuantificadores (cantidad)

SímboloSignificadoEjemploCoincide con
*0 o más veces/ho*/h, ho, hoo
+1 o más veces/ho+/ho, hoo
?0 o 1 vez/colou?r/color, colour
{n}Exactamente n veces/\d{3}/123
{n,}n o más veces/\d{2,}/12, 1234
{n,m}Entre n y m veces/\d{2,4}/12, 1234

📌 Conjuntos y rangos

SímboloSignificadoEjemploCoincide con
[abc]a o b o c/[aeiou]/a, e
[a-z]Rango/[a-z]/cualquier minúscula
[A-Z]Mayúsculas/[A-Z]/A
[0-9]Números/[0-9]/7
[^abc]Todo excepto a, b o c/[^0-9]/letras

📌 Posición (anclas)

SímboloSignificadoEjemploCoincide con
^Inicio del texto/^Hola/Hola mundo
$Fin del texto/mundo$/Hola mundo

📌 Agrupación y alternativas

SímboloSignificadoEjemploCoincide con
( )Agrupa/(hola)+/holahola
``Alternativa (o)`/(perro

📌 Banderas (modificadores)

Se colocan al final:

BanderaSignificadoEjemplo
gGlobal (todas las coincidencias)/\d/g
iIgnora mayúsculas/minúsculas/hola/i
mMultilínea/^hola/m

Print Friendly, PDF & Email

Lecciones:

Más entradas