Métodos de Strings - parte 1

Intermedio
JavaScript
JavaScript
Actualizado: 04/05/2026

Diagrama: tutorial-javascript-metodos-de-strings-parte-1

Diagrama del tema

Propiedades y métodos básicos

Los strings en JavaScript son secuencias de caracteres que representan texto. A diferencia de otros lenguajes, JavaScript no tiene un tipo específico para caracteres individuales; un carácter es simplemente un string de longitud 1. Vamos a explorar las propiedades y métodos fundamentales que nos permiten trabajar con strings de manera efectiva.

Propiedad length

La propiedad más básica y utilizada de un string es length, que nos devuelve el número de caracteres que contiene:

const greeting = "Hello, world!";
console.log(greeting.length); // 13

Esta propiedad es inmutable y de solo lectura, lo que significa que no podemos modificarla directamente:

const text = "JavaScript";
text.length = 4; // Esto no tiene efecto
console.log(text.length); // Sigue siendo 10

Acceso a caracteres individuales

Existen dos formas principales de acceder a caracteres individuales dentro de un string:

  • Notación de corchetes:
const language = "JavaScript";
console.log(language[0]); // "J"
console.log(language[4]); // "S"
  • Método charAt():
const language = "JavaScript";
console.log(language.charAt(0)); // "J"
console.log(language.charAt(4)); // "S"

La diferencia principal es que charAt() devuelve un string vacío cuando se accede a un índice fuera de rango, mientras que la notación de corchetes devuelve undefined:

const word = "Code";
console.log(word[10]); // undefined
console.log(word.charAt(10)); // "" (string vacío)

Búsqueda, extracción y más operaciones

Búsqueda en strings

JavaScript ofrece varios métodos para localizar substrings o caracteres dentro de un string:

  • indexOf()

Devuelve la primera posición donde aparece el substring especificado, o -1 si no se encuentra:

const sentence = "JavaScript is amazing";
console.log(sentence.indexOf("Script")); // 4
console.log(sentence.indexOf("Java")); // 0
console.log(sentence.indexOf("PHP")); // -1

También acepta un segundo parámetro opcional que indica desde qué posición comenzar la búsqueda:

const text = "The rain in Spain stays mainly in the plain";
console.log(text.indexOf("in")); // 5
console.log(text.indexOf("in", 6)); // 12
  • lastIndexOf()

Similar a indexOf(), pero busca desde el final hacia el principio, devolviendo la última ocurrencia:

const phrase = "The quick brown fox jumps over the lazy dog";
console.log(phrase.lastIndexOf("the")); // 31
console.log(phrase.lastIndexOf("fox")); // 16
  • includes()

Método más moderno que simplemente verifica si un string contiene otro, devolviendo un booleano:

const message = "Welcome to JavaScript course";
console.log(message.includes("JavaScript")); // true
console.log(message.includes("Python")); // false

También acepta una posición desde donde comenzar la búsqueda:

const text = "Hello world";
console.log(text.includes("o", 5)); // true
console.log(text.includes("o", 8)); // false
  • startsWith() y endsWith()

Estos métodos verifican si un string comienza o termina con el substring especificado:

const filename = "document.pdf";
console.log(filename.startsWith("doc")); // true
console.log(filename.endsWith(".pdf")); // true
console.log(filename.endsWith("txt")); // false

Ambos métodos también aceptan un parámetro opcional para indicar la posición:

const url = "https://example.com/path";
console.log(url.startsWith("example", 8)); // true

const file = "report-2023.xlsx";
console.log(file.endsWith("report", 6)); // true

Extracción de substrings

JavaScript proporciona tres métodos principales para extraer partes de un string:

  • slice()

Extrae una sección del string y devuelve un nuevo string sin modificar el original:

const text = "The morning is upon us";
console.log(text.slice(4, 11)); // "morning"
console.log(text.slice(12)); // "is upon us"

slice() también acepta índices negativos, que cuentan desde el final del string:

const word = "JavaScript";
console.log(word.slice(-6)); // "Script"
console.log(word.slice(4, -1)); // "Scrip"
  • substring()

Similar a slice(), pero con algunas diferencias clave:

const str = "Mozilla";
console.log(str.substring(1, 3)); // "oz"
console.log(str.substring(2)); // "zilla"

A diferencia de slice(), substring() trata los valores negativos como 0 y automáticamente intercambia los argumentos si el primero es mayor que el segundo:

const text = "JavaScript";
console.log(text.substring(4, 0)); // "Java" (intercambia 4 y 0)
console.log(text.substring(-3)); // "JavaScript" (trata -3 como 0)
  • substr() (Considerado obsoleto)

Aunque sigue funcionando, este método está desaconsejado en favor de slice() y substring(). Extrae caracteres desde una posición y con una longitud determinada:

const language = "JavaScript";
console.log(language.substr(4, 6)); // "Script"

Métodos de comparación

  • charCodeAt()

Devuelve el valor Unicode del carácter en la posición especificada:

const text = "ABC";
console.log(text.charCodeAt(0)); // 65 (código Unicode para 'A')
console.log(text.charCodeAt(1)); // 66 (código Unicode para 'B')
  • codePointAt()

Similar a charCodeAt(), pero con mejor soporte para caracteres que ocupan más de 16 bits (como emojis):

const emoji = "";
console.log(emoji.codePointAt(0)); // 128512
  • localeCompare()

Compara dos strings en el orden alfabético según la configuración regional:

const a = "apple";
const b = "banana";

console.log(a.localeCompare(b)); // -1 (a viene antes que b)
console.log(b.localeCompare(a)); // 1 (b viene después que a)
console.log(a.localeCompare(a)); // 0 (son iguales)

Este método es especialmente útil para ordenar strings que contienen caracteres específicos de un idioma:

const words = ["café", "cafetería", "cafe"];
words.sort((a, b) => a.localeCompare(b, "es"));
console.log(words); // ["cafe", "café", "cafetería"]

Concatenación de strings

Existen varias formas de combinar strings en JavaScript:

  • Operador +
const firstName = "John";
const lastName = "Doe";
const fullName = firstName + " " + lastName;
console.log(fullName); // "John Doe"
  • Método concat()
const greeting = "Hello";
const name = "World";
console.log(greeting.concat(", ", name, "!")); // "Hello, World!"
  • Template literals (ES6+)

La forma más moderna y legible de concatenar strings:

const product = "Laptop";
const price = 999;
const currency = "USD";

const message = `The ${product} costs ${price} ${currency}`;
console.log(message); // "The Laptop costs 999 USD"

Repetición de strings

El método repeat() permite crear un nuevo string que contiene copias del original:

const star = "*";
console.log(star.repeat(5)); // "*****"

const hello = "Hello ";
console.log(hello.repeat(3)); // "Hello Hello Hello "

Este método es útil para crear patrones o indentación:

function createIndent(level) {
    return "  ".repeat(level);
}

console.log(createIndent(3) + "- Item"); // "      - Item"

Eliminación de espacios en blanco

JavaScript ofrece métodos para eliminar espacios en blanco al principio y/o final de un string:

  • trim()

Elimina espacios en blanco de ambos extremos:

const text = "   Hello world!   ";
console.log(text.trim()); // "Hello world!"
  • trimStart() / trimLeft()

Elimina espacios en blanco solo del inicio:

const input = "   user@example.com";
console.log(input.trimStart()); // "user@example.com"
  • trimEnd() / trimRight()

Elimina espacios en blanco solo del final:

const code = "ABC123   ";
console.log(code.trimEnd()); // "ABC123"

Estos métodos son particularmente útiles al procesar entradas de usuario o datos de formularios:

function validateEmail(email) {
    const trimmedEmail = email.trim();
    return trimmedEmail.includes("@") && trimmedEmail.includes(".");
}

console.log(validateEmail("  user@example.com  ")); // true

Los métodos básicos de strings en JavaScript proporcionan una base sólida para manipular texto de manera efectiva. Dominar estas herramientas fundamentales es esencial antes de avanzar hacia técnicas más avanzadas de transformación y manipulación de strings.

Alan Sastre - Autor del tutorial

Alan Sastre

Ingeniero de Software y formador, CEO en CertiDevs

Ingeniero de software especializado en Full Stack y en Inteligencia Artificial. Como CEO de CertiDevs, JavaScript es una de sus áreas de expertise. Con más de 15 años programando, 6K seguidores en LinkedIn y experiencia como formador, Alan se dedica a crear contenido educativo de calidad para desarrolladores de todos los niveles.

Más tutoriales de JavaScript

Explora más contenido relacionado con JavaScript y continúa aprendiendo con nuestros tutoriales gratuitos.

Aprendizajes de esta lección

  • Comprender la diferencia entre un string y un carácter en JavaScript.
  • Utilizar la propiedad length para conocer el número de caracteres.
  • Acceder a caracteres individuales usando corchetes o charAt().
  • Buscar substrings con métodos como indexOf(), includes(), y startsWith().
  • Extraer partes de un string usando slice(), substring(), y substr().
  • Comparar strings mediante charCodeAt() y localeCompare().
  • Concatenar strings con el operador +, concat(), y template literals.