Ejemplos de subcadenas de JavaScript: Métodos Slice, Substr y Substring en JS

Original article: JavaScript Substring Examples - Slice, Substr, and Substring Methods in JS

En la programación diaria, a menudo necesitamos trabajar con cadenas. Afortunadamente, hay muchos métodos incorporados en JavaScript que nos ayudan mientras trabajaban con matrices, cadenas y otros tipos de datos. Podemos usar estos métodos para varias operaciones como buscar, reemplazar, concatenar cadenas, etc.

Obtener una subcadena de una cadena es una de las operaciones más comunes en JavaScript. En este artículo, aprenderá cómo obtener una subcadena mediante el uso de 3 métodos integrados diferentes. Pero primero, déjame explicarte qué es probable que sea una subcadena.

¿Qué es una subcadena?

Una subcadena es un subconjunto de otra cadena:

"I am learning JavaScript and it is cool!"  -->  Original String

"I am learning JavaScript"  -->  Substring

"JavaScript is cool!"  -->  Another Substring

Como en el ejemplo anterior, en algunos casos necesitamos obtener una o más subcadenas de una oración completa o un párrafo. Ahora veamos cómo hacer eso en JavaScript de 3 maneras diferentes.

1. El método de la subcadena()

Empecemos con el método substring(). Este método básicamente obtiene una parte de la cadena original y la devuelve como una nueva cadena. El método de subcadena espera dos parámetros:

string.substring(startIndex, endIndex);

• startIndex : representa el punto de inicio de la subcadena
• endIndex : representa el punto final de la subcadena (opcional)

Veamos el uso en un ejemplo. Supongamos que tenemos la siguiente cadena de ejemplo:

const myString = "I am learning JavaScript and it is cool!";

Ahora, si configuramos startIndex como 0 y endIndex como 10, obtendremos los primeros 10 caracteres de la cadena original:

Sin embargo, si establecemos solo un índice inicial y ningún índice final para este ejemplo:

Luego obtenemos una subcadena que comienza desde el sexto carácter hasta el final de la cadena original.

Algunos puntos adicionales:

• Si startIndex = endIndex, el método de subcadena devuelve una cadena vacía
• Si startIndex y endIndex son mayores que la longitud de la cadena, devuelve una cadena vacía
• Si startIndex > endIndex, el método de subcadena intercambia los argumentos y devuelve una subcadena, asumiendo que endIndex > startIndex

2. El método slice( )

El método slice( ) es similar al método substring( ) y también devuelve una subcadena de la cadena original. El método slice() también espera los mismos dos parámetros:

string.slice(startIndex, endIndex);

• startIndex: representa el punto de partida de la subcadena
• endIndex: representa el punto final de la subcadena (opcional)

Los puntos comunes de los métodos substring() y slice():

• Si configuramos startIndex y endIndex, obtendremos los caracteres entre los números de índice dados de la cadena original:

• Si startIndex y endIndex son mayores que la longitud de la cadena, devuelve una cadena vacía

Diferencias del método slice():

• Si startIndex es un número negativo, entonces el primer carácter comienza desde el final de la cadena (al revés):

Nota: Podemos usar el método slice() también para arreglos de JavaScript.

3. El método substr()

Según los documentos de Mozilla , el método substr() se considera una función heredada y se debe evitar su uso. Pero aún explicaré brevemente lo que hace porque es posible que lo vea en proyectos más antiguos.

El método substr( ) también devuelve una subcadena de la cadena original y espera dos parámetros como:

string.substring(startIndex, length);

• startIndex : representa el punto de inicio de la subcadena
• length: número de caracteres a incluir (opcional)

Puede ver la diferencia aquí: el método substr() espera que el segundo parámetro sea una longitud en lugar de un índice final:

En este ejemplo, básicamente cuenta 5 caracteres que comienzan con el índice de inicio dado y los devuelve como una subcadena.

Sin embargo, si no definimos el segundo parámetro, regresa hasta el final de la cadena original (como lo hacen los dos métodos anteriores):

Nota: Los 3 métodos devuelven la subcadena como una nueva cadena y no cambian la cadena original.

Conclusión

Estos son los 3 métodos diferentes para obtener una subcadena en JavaScript. Hay muchos otros métodos incorporados en JS que realmente nos ayudan mucho cuando tratamos con varias cosas en la programación. Si encuentra útil esta publicación, compártala en las redes sociales.

Si quieres aprender más sobre desarrollo web, ¡no dudes en seguirme en Youtube !

¡Gracias por leer!