Cadenas de texto en JavaScript

Las cadenas (strings) son el tipo de dato para guardar texto. Casi todos los programas trabajan con texto: nombres, emails, mensajes, contenido de una página…

Tres tipos de comillas

const a = "comillas dobles";
const b = 'comillas simples';
const c = `comillas invertidas`;

Las dobles y las simples son equivalentes; la de cierre tiene que coincidir con la de apertura. Elige una y úsala siempre (en JavaScript es muy habitual la simple, porque el HTML usa las dobles; en JSON, en cambio, son obligatorias las dobles).

Las invertidas crean plantillas (template literals), que tienen dos superpoderes:

const nombre = "Ana";
const puntos = 42;

// 1. Meter variables y expresiones con ${ }
const mensaje = `${nombre} tiene ${puntos} puntos (${puntos * 2} con el bonus)`;

// 2. Varias líneas sin trucos
const html = `
  <li>
    <strong>${nombre}</strong>
  </li>
`;

Caracteres especiales

Algunos caracteres se escriben con una barra invertida \:

"Línea 1\nLínea 2"     // \n: salto de línea
"Columna\tColumna"     // \t: tabulador
'It\'s ok'             // \': comilla dentro de comillas iguales
"Ruta: C:\\archivos"   // \\: una barra invertida

Longitud y caracteres

const palabra = "JavaScript";
palabra.length      // 10
palabra[0]          // "J" (las posiciones empiezan en 0)
palabra[palabra.length - 1]  // "t", el último
palabra.at(-1)      // "t", otra forma de pedir el último
palabra[20]         // undefined

length es una propiedad, no una función: se escribe sin paréntesis. palabra.length() da error.

Cuidado con las erratas: si escribes palabra.lenght, JavaScript no da error, devuelve undefined. En un bucle for (let i = 0; i < palabra.lenght; i++), la condición 0 < undefined es falsa y el bucle termina sin hacer nada y sin avisar.

Las cadenas son inmutables: palabra[0] = "j" no hace nada. Todos los métodos devuelven una cadena nueva y dejan la original igual.

Recorrer una cadena

for (const letra of "hola") {
  console.log(letra);   // h, o, l, a
}

for...of es la forma más clara. Además funciona bien con emojis y otros caracteres especiales, que ocupan “dos posiciones” y se rompen con un bucle por índice.

Mayúsculas y espacios

"Hola".toUpperCase()        // "HOLA"
"Hola".toLowerCase()        // "hola"
"  hola  ".trim()           // "hola" (quita espacios, tabuladores y saltos de los extremos)
"  hola  ".trimStart()      // "hola  "

Un uso muy habitual: normalizar lo que escribe el usuario antes de compararlo.

const respuesta = "  SÍ ";
if (respuesta.trim().toLowerCase() === "sí") { ... }

Buscar

const texto = "Aprender a programar";

texto.includes("programar")   // true
texto.startsWith("Apr")       // true
texto.endsWith(".pdf")        // false
texto.indexOf("a")            // 9: posición de la primera "a" minúscula
texto.lastIndexOf("a")        // 18: posición de la última
texto.indexOf("xyz")          // -1: no está

Extraer un trozo: slice

slice(inicio, fin) devuelve el texto desde inicio (incluido) hasta fin (excluido):

const codigo = "ES-2026-0042";
codigo.slice(0, 2)    // "ES"
codigo.slice(3, 7)    // "2026"
codigo.slice(8)       // "0042" (hasta el final)
codigo.slice(-4)      // "0042" (los últimos 4)

Si los números se salen de la cadena no pasa nada: "abc".slice(0, 99) devuelve "abc". Si inicio es mayor o igual que fin, devuelve "".

Verás también substring() y el obsoleto substr(). Con slice tienes suficiente.

Dividir, unir y reemplazar

"rojo,verde,azul".split(",")          // ["rojo", "verde", "azul"]
"hola".split("")                      // ["h", "o", "l", "a"]
["2026", "10", "01"].join("-")        // "2026-10-01"

"color beige".replace("beige", "crema")   // "color crema" (solo la primera aparición)
"a-b-c".replaceAll("-", "/")              // "a/b/c" (todas)

Rellenar y repetir

"7".padStart(3, "0")      // "007"
"5".padEnd(4, ".")        // "5..."
"ja".repeat(3)            // "jajaja"

padStart es perfecto para mostrar horas y fechas: String(minutos).padStart(2, "0").

Comparar textos

=== compara exactamente, distinguiendo mayúsculas y tildes. Para ordenar textos en español correctamente (con tildes y la ñ en su sitio), usa localeCompare:

["zorro", "Ávila", "ñu", "casa"].sort((a, b) => a.localeCompare(b, "es"));
// ["Ávila", "casa", "ñu", "zorro"]

Resumen de métodos

Método	Devuelve
length	Número de caracteres (propiedad)
toUpperCase() / toLowerCase()	El texto en mayúsculas / minúsculas
trim()	Sin espacios en los extremos
includes(x), startsWith(x), endsWith(x)	true o false
indexOf(x)	Posición de la primera aparición, o -1
slice(i, j)	El trozo de i a j (sin incluir j)
split(sep)	Un array con los trozos
replace(a, b) / replaceAll(a, b)	Texto con a cambiado por b
padStart(n, c)	Rellenado por la izquierda hasta n caracteres

console.log("JavaScript".slice(0, 4));