Expresiones Regulares en JavaScript: Guía Completa

Creando expresiones regulares en JavaScript

En JavaScript, puedes crear expresiones regulares utilizando el constructor new RegExp('patrón','modificadores') o la sintaxis literal /patrón/modificadores.

const regex = /caja/; // Verifica si una cadena contiene la palabra 'caja'
const texto = 'cajón grande';

Métodos de las expresiones regulares

Método test

El método test devuelve true o false según si encuentra o no la coincidencia.

const patron = /caja/;
const cadena = 'cajón grande';

console.log(patron.test(cadena)); // => true

Método exec

El método exec devuelve un array con la coincidencia encontrada o null si no hay coincidencias.

const expresion = /caja/;
const frase = 'cajón grande';

const resultado = expresion.exec(frase);
console.log(resultado); // => ["caja", index: 0, input: "cajón grande", groups: undefined]

console.log(Array.from(resultado)); // => ["caja"]

Propiedad source

Devuelve el patrón de la expresión regular.

const reg = /caja/g;

console.log(reg.source); // => caja

Propiedad flags

Devuelve los modificadores de la expresión regular.

const reg = /caja/gi;

console.log(reg.flags); // => gi

Propiedad lastIndex

Especifica la posición desde donde comenzará la próxima búsqueda. Solo tiene efecto con el modificador g (global).

Modos de coincidencia

  • i: Ignora mayúsculas y minúsculas.
  • g: Coincidencia global (busca todas las coincidencias, no se detiene en la primera).
  • u: Modo Unicode (introducido en ES2015), maneja correctamente caracteres Unicode mayores que \uFFFF.
  • y: Modo adhesivo (introducido en ES2015), similar a g pero requiere que la coincidencia comience exactamente en la posición indicada por lastIndex.
  • s: Permite que el punto . coincida con cualquier carácter, incluyendo saltos de línea (introducido en ES2018).
const regex1 = /b/;
const regex2 = /b/i;

const texto = 'Caja';

console.log(regex1.test(texto)); // => false
console.log(regex2.test(texto)); // => true

/punto.fin/s.test('punto\nfin') // => true

Sintaxis de las expresiones regulares

Operador | (O lógico)

Verifica si una cadena contiene uno de los caracteres o patrones espceificados.

const reg = /a|b/; // Contiene 'a' o 'b'
const str = 'reloj';
console.log(reg.test(str)); // => true

Clases de caracteres []

Representan un conjunto de caracteres con los que puede coincidir.

const reg1 = /[ab]/; // Contiene 'a' o 'b'
const reg2 = /[d-f]/; // Contiene letras minúsculas de 'd' a 'f'
const reg3 = /[A-Z]/; // Contiene letras mayúsculas de 'A' a 'Z'
const reg4 = /[A-z]/; // Cualquier letra, sin distinguir mayúsculas/minúsculas
const reg5 = /[0-9]/; // Cualquier dígito
const str = 'reloj';

console.log(reg1.test(str)); // => true
console.log(reg2.test(str)); // => false

Negación [^ ]

Coincide con cualquier carácter que no esté en el conjunto.

const reg1 = /[^caja]/; // Cualquier carácter excepto 'c', 'a', 'j', 'a'
const reg2 = /[^0-9]/; // Cualquier carácter que no sea un dígito
const str1 = 'nuevo caja';
const str2 = 'caja';

console.log(reg1.test(str1)); // => true
console.log(reg1.test(str2)); // => false

Cuantificadores {n}

Especifican el número de veces que un elemento debe aparecer.

const telefono = '612345678';
const reg1 = /[0-9]{9}/; // Cualquier dígito aparece 9 veces
const reg2 = /[0-9]{3,6}/; // Cualquier dígito aparece entre 3 y 6 veces

console.log(reg1.test(telefono)); // => true
console.log(reg2.test(telefono)); // => false

Los cuantificadores comunes:

  • n+: Una o más veces
  • n*: Cero o más veces
  • n?: Cero o una vez

Inicio de cadena ^

Coincide con el inicio de una cadena.

const reg = /^h/; // Empieza con 'h'
const str = 'https://'

console.log(reg.test(str)); // => true

Fin de cadena $

Coincide con el final de una cadena.

const reg = /(com|ar)$/; // Termina con 'com' o 'ar'
const str = 'com'

console.log(reg.test(str)); // => true

Metacaracteres

Metacarácter Descripción
. Cualquier carácter
\\. Un punto literal
\\\\ Una barra invertida literal
\\d Cualquier dígito (equivalente a [0-9])
\\D Cualquier carácter que no sea dígito
\\w Cualquier carácter alfanumérico o guión bajo
\\W Cualquier carácter no alfanumérico ni guión bajo
\\s Cualquier carácter de espacio en blanco
\\S Cualquier carácter que no sea de espacio en blanco
\\b Límite de palabra
\\t Tabulador
\\n Salto de línea

Métodos de cadena con expresiones regulares

Método split

Divide una cadena en un array utilizando una expresión regular.

const str = '1a2b3c4d5e6';

console.log(str.split(/[A-z]/)); // => ["1", "2", "3", "4", "5", "6"]

Método search

Busca una coincidencia en una cadena y devuelve el índice de la primera coincidencia, o -1 si no se encuentra.

const str = 'Tengo 5 dólares';

console.log(str.search(/[0-9]/)); // => 5

Método match

Extrae todas las coincidencias de una cadena según una expresión regular.

const str = '6f12ffP122d';
const matches = str.match(/[A-z]/g); // => ["f", "f", "f", "P", "d"]

console.log(matches.join('')); // => 'fffPd'

Método replace

Reemplaza las coincidencias de una cadena según una expresión regular.

const texto = 'Perrocalvo';

console.log(texto.replace(/calvo/i, '**')) // => Perro**vo

Método matchAll

Introducido en ES2020, devuelve un iterador con todas las coincidencias encontradas.

const cadena = 'prueba1prueba2prueba3';
const regex = /p(r)(ueba(\d?))/g;

for (const coincidencia of cadena.matchAll(regex)) {
  console.log(coincidencia);
}
// =>
/*
["prueba1", "r", "ueba1", "1", index: 0, input: "prueba1prueba2prueba3"]
["prueba2", "r", "ueba2", "2", index: 6, input: "prueba1prueba2prueba3"]
["prueba3", "r", "ueba3", "3", index: 12, input: "prueba1prueba2prueba3"]
*/

Etiquetas: JavaScript expresiones-regulares Regex programacion-web desarrollo-front-end

Publicado el 6-20 05:11