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
nombreArchivo.lastIndexOf(".")devuelve12, la posición del último punto en el string.nombreArchivo.substring(0, 12)extrae caracteres desde el índice0hasta (sin incluir) el índice12, y produce"reporte-2024".nombreArchivo.substring(13)omite el argumento final, así que la extracción va desde el índice13hasta el final del string, y devuelve"csv".- Ambas llamadas devuelven strings nuevos, el
nombreArchivooriginal 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
| Comportamiento | substring(start, end) | slice(start, end) |
|---|---|---|
| Argumentos negativos | Se ajustan a 0 | Cuentan desde el final del string |
start > end | Se intercambian automáticamente | Devuelve string vacío "" |
| Índice fuera de rango | Se ajusta a string.length | Se ajusta a string.length |
| Modifica el original | No | No |
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:
- Reemplaza
str.substr(start, length)porstr.substring(start, start + length). - Si
startpuede ser negativo, cambia aslice(start, start + length)en su lugar,substringajusta negativos a0. - Prueba casos límite donde
lengthes0, negativo u omitido, porquesubstrysubstringdifieren 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.