JavaScript substring: extraer texto por índice

El método substring de JavaScript extrae caracteres entre dos posiciones de índice y devuelve un string nuevo. Acepta un índice inicial y un índice final opcional (exclusivo), y toma todo desde start hasta end sin incluirlo. Cuando se omite el índice final, la extracción continúa hasta el final del string. A diferencia de slice, substring intercambia automáticamente sus argumentos cuando start es mayor que end, lo que evita resultados vacíos accidentales.

Ejemplo de JavaScript substring para extraer texto

Salida:

La salida aparecerá aquí...

Salida:

Nombre: reporte-2024
Extensión: csv

Cómo funciona este ejemplo

  1. nombreArchivo.lastIndexOf(".") devuelve 12, la posición del último punto en el string.
  2. nombreArchivo.substring(0, 12) extrae caracteres desde el índice 0 hasta (sin incluir) el índice 12, y produce "reporte-2024".
  3. nombreArchivo.substring(13) omite el argumento final, así que la extracción va desde el índice 13 hasta el final del string, y devuelve "csv".
  4. Ambas llamadas devuelven strings nuevos, el nombreArchivo original nunca se modifica porque los strings en JavaScript son inmutables.

Errores comunes con JavaScript substring

Esperar que los índices negativos cuenten desde el final.

Incorrecto:

"hello".substring(-3); // "hello", no "llo"

Correcto:

"hello".slice(-3); // "llo"

substring ajusta los valores negativos a 0, así que substring(-3) se convierte en substring(0) y devuelve el string completo. Usa slice para desplazamientos relativos al final.

Tratar el segundo argumento como una longitud.

Incorrecto:

"abcdef".substring(2, 3); // "c", no "cde"

Correcto:

"abcdef".substring(2, 5); // "cde"

El segundo parámetro es un índice final, no una cantidad de caracteres. Esta confusión suele venir del substr(start, length) heredado, donde "abcdef".substr(2, 3) devuelve "cde". Al migrar desde substr, convierte la longitud en un índice final: start + length.

JavaScript substring vs slice

Comportamientosubstring(start, end)slice(start, end)
Argumentos negativosSe ajustan a 0Cuentan desde el final del string
start > endSe intercambian automáticamenteDevuelve string vacío ""
Índice fuera de rangoSe ajusta a string.lengthSe ajusta a string.length
Modifica el originalNoNo

Usa substring cuando los índices vienen de cálculos que pueden llegar en orden incorrecto, el intercambio automático garantiza un resultado válido. Usa slice cuando los desplazamientos negativos son intencionales, por ejemplo, para extraer los últimos N caracteres con str.slice(-N).

Reemplazar el substr heredado con substring

El método heredado substr(start, length) (a menudo llamado JavaScript substr) todavía aparece en código antiguo y está desaprobado en la documentación. La confusión entre JavaScript substr y substring suele venir del significado distinto del segundo argumento: substr recibe una longitud, mientras que substring recibe un índice final. Para migrar con seguridad:

  1. Reemplaza str.substr(start, length) por str.substring(start, start + length).
  2. Si start puede ser negativo, cambia a slice(start, start + length) en su lugar, substring ajusta negativos a 0.
  3. Prueba casos límite donde length es 0, negativo u omitido, porque substr y substring difieren en esas entradas.

FAQ

¿Cuál es la diferencia entre JavaScript substring y slice?

Ambos extraen parte de un string por índice, pero se comportan distinto en casos límite. substring ajusta argumentos negativos a 0 e intercambia inicio y fin cuando el inicio es mayor. slice interpreta negativos como desplazamientos desde el final y devuelve un string vacío cuando el inicio supera al fin. Para extracción normal con índices hacia adelante, ambos producen resultados idénticos.

¿JavaScript substring modifica el string original?

No. Los strings de JavaScript son inmutables, cada método de string devuelve un string nuevo. El original permanece igual después de cualquier llamada a substring. Asigna el resultado a una variable para conservar la porción extraída.

¿Qué pasa cuando start es mayor que end en substring?

substring intercambia silenciosamente los dos argumentos. "abcdef".substring(4, 1) se comporta como "abcdef".substring(1, 4) y devuelve "bcd". Esta normalización evita sorpresas de strings vacíos cuando los cálculos de índices producen límites invertidos.