Curso javascript nivel medio
Las expresiones regulares (también conocidas como regex) en JavaScript son patrones que se utilizan para buscar y manipular texto de manera eficiente. Son como "plantillas" que te permiten buscar coincidencias dentro de cadenas de texto o realizar reemplazos.
Concepto clave:
Una expresión regular es básicamente una secuencia de caracteres que describe un patrón. Puedes usar ese patrón para encontrar, validar o reemplazar partes de una cadena.
¿Para qué sirven?
- Buscar coincidencias en una cadena de texto (por ejemplo, buscar todas las veces que aparece una palabra).
- Validar formatos (como si un correo electrónico tiene el formato correcto).
- Reemplazar partes del texto (como cambiar ciertas palabras o caracteres).
¿Cómo se usan en JavaScript?
En JavaScript, las expresiones regulares se representan entre dos barras inclinadas / y se pueden usar con métodos como test, match, replace, split, entre otros.
Sintaxis básica:
1const regex = /patrón/;
Métodos más comunes:
-
test(): Comprueba si una cadena coincide con la expresión regular.1const regex = /hola/; 2const cadena = "hola mundo"; 3console.log(regex.test(cadena)); // true (porque "hola" está en la cadena)Salida de Consola!: true
-
match(): Busca coincidencias en una cadena y devuelve las coincidencias encontradas.1const regex = /hola/; 2const cadena = "hola hola hola"; 3console.log(cadena.match(regex)); // ["hola"] (la primera coincidencia)Salida de Consola!: [ 'hola', index: 0, input: 'hola hola hola', groups: undefined ]
-
replace(): Reemplaza el texto que coincide con el patrón en una cadena.1const regex = /hola/; 2const cadena = "hola mundo"; 3console.log(cadena.replace(regex, "adiós")); // "adiós mundo"Salida de Consola!: adiós mundo
Caracteres especiales en expresiones regulares:
Las expresiones regulares tienen ciertos caracteres especiales que permiten crear patrones más poderosos:
-
. (punto): Representa cualquier carácter.
1const regex = /h.la/; 2console.log(/hola/.test("hola")); // true 3console.log(/h.la/.test("hila")); // trueSalida de Consola!: true true
-
\d: Representa cualquier número (0-9).
1const regex = /\d/; 2console.log(/\d/.test("2023")); // true (porque contiene números) 3console.log(/\d/.test("abc")); // false (no hay números)Salida de Consola!: true false
-
\w: Representa cualquier carácter alfanumérico (letras o números).
1const regex = /\w/; 2console.log(/\w/.test("abc123")); // trueSalida de Consola!: true
-
\s: Representa cualquier espacio en blanco.
1const regex = /\s/; 2console.log(/\s/.test("hola mundo")); // true (hay un espacio entre las palabras)Salida de Consola!: true
-
+: Indica que el carácter o conjunto anterior aparece una o más veces.
1const regex = /ho+la/; 2console.log(/ho+la/.test("hola")); // true 3console.log(/ho+la/.test("hooola")); // trueSalida de Consola!: true true
-
** \ **: Escapa caracteres especiales para tratarlos como texto literal.
1const regex = /\./; // busca literalmente el punto "." 2console.log(/\./.test("a.b.c")); // trueSalida de Consola!: true
-
^ y $:
^indica el inicio de una cadena, y$indica el final.^abccoincide con cadenas que comienzan con "abc".abc$coincide con cadenas que terminan con "abc".
1const regexInicio = /^hola/; 2console.log(regexInicio.test("hola mundo")); // true 3console.log(regexInicio.test("mundo hola")); // falseSalida de Consola!: true false
1const regexFin = /mundo$/; 2console.log(regexFin.test("hola mundo")); // trueSalida de Consola!: true
Ejemplos comunes de uso:
-
Validar un correo electrónico:
1const emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; 2console.log(emailRegex.test("ejemplo@mail.com")); // true 3console.log(emailRegex.test("mail.com")); // falseSalida de Consola!: true false
-
Validar un número de teléfono:
1const telefonoRegex = /^\d{3}-\d{3}-\d{4}$/; 2console.log(telefonoRegex.test("123-456-7890")); // true 3console.log(telefonoRegex.test("1234567890")); // falseSalida de Consola!: true false
-
Encontrar todas las palabras en un texto:
1const texto = "Hola mundo, como estas?"; 2const regex = /\w+/g; // \w+ busca palabras 3console.log(texto.match(regex)); // [ 'Hola', 'mundo', 'como', 'estas' ]Salida de Consola!: [ 'Hola', 'mundo', 'como', 'estas' ]
Resumen:
- Las expresiones regulares son patrones que te permiten buscar, validar y manipular texto.
- Métodos clave:
test(),match(),replace(). - Utilizan caracteres especiales (como
\d,.o+) para definir patrones más complejos. - Son útiles para tareas comunes como la validación de formularios, el procesamiento de cadenas, y la búsqueda de texto.
Aunque al principio pueden parecer complicadas, las expresiones regulares son extremadamente poderosas una vez que las entiendes.
- Loading...
Objetivo:
Crea una función llamada
obtenerHrefque acepte una cadena de texto que contenga un enlace HTML y devuelva el valor del atributohref.Instrucciones:
- Usa una expresión regular para extraer el valor del atributo
hrefde la etiqueta<a>. - Devuelve el valor extraído.
- En caso de no encontar nada devolverá null.
Ejemplo:
Ir a google ===> www.google.es
Loading...- Usa una expresión regular para extraer el valor del atributo