Strings y expresiones regulares

10 min lectura

TextoCap. 2 — Datos y estructuras

Template literals

Los template literals (comillas invertidas) son la forma moderna de trabajar con strings. Soportan:

Interpolacion de expresiones con ${}
Multilinea sin necesidad de \n
Tagged templates para procesamiento personalizado

const precio = 99.5;
const mensaje = `El total es: $${precio.toFixed(2)}`;
// "El total es: $99.50"

Métodos de string esenciales

Los strings en JavaScript son inmutables: cada método retorna un nuevo string.

Método	Descripcion	Ejemplo
`trim()`	Elimina espacios al inicio y final	`' hola '.trim()` -> `'hola'`
`includes(s)`	Verifica si contiene el substring	`'hola'.includes('ol')` -> `true`
`startsWith(s)`	Verifica el inicio	`'hola'.startsWith('ho')` -> `true`
`endsWith(s)`	Verifica el final	`'hola'.endsWith('la')` -> `true`
`slice(i, j)`	Extrae una porcion	`'hola'.slice(1, 3)` -> `'ol'`
`split(sep)`	Divide en array	`'a,b'.split(',')` -> `['a','b']`
`replace(a, b)`	Reemplaza la primera coincidencia	`'aaa'.replace('a','b')` -> `'baa'`
`replaceAll(a, b)`	Reemplaza todas	`'aaa'.replaceAll('a','b')` -> `'bbb'`

padStart y padEnd

Estos métodos son útiles para formatear texto a una longitud fija:

const id = '7';
console.log(id.padStart(4, '0')); // '0007'
console.log(id.padEnd(4, '-'));   // '7---'

Expresiones regulares (RegExp)

Las expresiones regulares permiten buscar patrones en texto. Se crean con sintaxis literal /patrón/flags o con new RegExp():

Caracteres especiales comunes

Patron	Significado
`\d`	Un digito (0-9)
`\w`	Letra, digito o guion bajo
`\s`	Espacio en blanco
`.`	Cualquier caracter
`+`	Uno o más
`*`	Cero o más
`?`	Cero o uno
`{n,m}`	Entre n y m repeticiones
`^`	Inicio de la cadena
`$`	Final de la cadena

Flags

Flag	Descripcion
`g`	Global - busca todas las coincidencias
`i`	Case insensitive
`m`	Multilinea

Métodos útiles

regex.test(str) — Retorna true/false si hay coincidencia
str.match(regex) — Retorna las coincidencias encontradas
str.replace(regex, reemplazo) — Reemplaza coincidencias

Grupos de captura

Los parentesis () crean grupos que puedes extraer individualmente. Los grupos nombrados (?<nombre>...) hacen el código más legible.

Práctica

Formatea con template literals y padStart: Crea una funcion formatearId(id) que reciba un numero y retorne un string de 6 digitos con ceros a la izquierda (ej: 7 -> '000007'). Usa template literals para retornar "ID: 000007".
Divide y une strings: Dada la cadena 'manzana, banana, cereza, durazno', usa split para obtener un array de frutas, map para poner cada fruta en mayusculas, y join para unirlas con ' | '.
Extrae datos con regex y grupos: Escribe una expresion regular con grupos de captura nombrados para extraer el dia, mes y anio de una fecha con formato 'DD/MM/YYYY'. Probala con '15/03/2026'.

En la siguiente leccion aprenderemos a seleccionar y modificar elementos del DOM.

Template literals para todo

Usa template literals (backticks) siempre que necesites interpolación o cadenas multilinea. Son más legibles que la concatenación con +.

Regex con moderacion

Las expresiones regulares son poderosas pero pueden volverse ilegibles rapidamente. Para validaciones complejas, considera dividirlas en multiples patrones simples o usar una libreria de validación.

// Template literals
const nombre = 'Carlos';
const edad = 28;
const bio = `Me llamo ${nombre} y tengo ${edad} años.
Esta es una cadena multilinea.`;

// Métodos de string
const texto = '  Hola Mundo JavaScript  ';

console.log(texto.trim());              // 'Hola Mundo JavaScript'
console.log(texto.trim().toLowerCase()); // 'hola mundo javascript'
console.log(texto.trim().toUpperCase()); // 'HOLA MUNDO JAVASCRIPT'

console.log(texto.includes('Mundo'));    // true
console.log(texto.startsWith('  Hola')); // true
console.log(texto.endsWith('  '));       // true

// split y join
const csv = 'manzana,banana,cereza';
const frutas = csv.split(',');
// ['manzana', 'banana', 'cereza']
const unido = frutas.join(' | ');
// 'manzana | banana | cereza'

// slice (no muta)
const archivo = 'documento.pdf';
const extensión = archivo.slice(archivo.lastIndexOf('.'));
// '.pdf'

// repeat y padStart
const código = '42';
console.log(código.padStart(6, '0')); // '000042'
console.log('='.repeat(20)); // '===================='

// replaceAll (ES2021)
const ruta = 'src\\app\\core\\models';
const unix = ruta.replaceAll('\\', '/');
// 'src/app/core/models'

// Crear regex
const patronEmail = /^[\w.-]+@[\w.-]+\.\w{2,}$/;
const patronNumero = /^\d+$/;

// test - retorna boolean
console.log(patronEmail.test('[email protected]'));  // true
console.log(patronEmail.test('invalido'));        // false

// match - retorna coincidencias
const texto = 'Hay 3 gatos y 7 perros en 2 casas';
const números = texto.match(/\d+/g);
// ['3', '7', '2']

// replace con regex
const limpio = '  espacios   extra  '.replace(/\s+/g, ' ').trim();
// 'espacios extra'

// Grupos de captura
const fecha = '2026-03-06';
const [, anio, mes, dia] = fecha.match(/(\d{4})-(\d{2})-(\d{2})/);
console.log(`${dia}/${mes}/${anio}`); // '06/03/2026'

// Named groups (ES2018)
const resultado = fecha.match(/(?<anio>\d{4})-(?<mes>\d{2})-(?<dia>\d{2})/);
console.log(resultado.groups.anio); // '2026'