Posiciones y substring


Hay dos conceptos muy importantes relacionados con los strings, y son los conceptos substring y posición. Aunque son bastante autoexplicativos, vamos a explicarlos.

  • Un substring es un fragmento más pequeño que forma parte de un string.

  • Una posición (o índice) es un number que representa el lugar donde está ubicado un substring, teniendo en cuenta que se empieza a contar desde 0. Así, la primera letra del string tendría el índice 0, la segunda 1, la tercera 2, etc…

Obtener posición o índice

En primer lugar existen varios métodos que permiten darnos información sobre la posición o ubicación que ocupa un determinado carácter o texto. Esta posición también suele denominarse índice. Veamos detalladamente dichos métodos:

Método Descripción Retorna
.charAt(pos) Devuelve el carácter en la posición pos de la variable. string
.indexOf(str) Devuelve la primera posición del texto str. number
.indexOf(str, from) Igual al anterior, partiendo desde la posición from. number
.lastIndexOf(str) Devuelve la última posición del texto str. number
.lastIndexOf(str,from) Identico al anterior, partiendo desde from hacia el inicio. number

Carácter en cierta posición

El método .charAt(pos) nos permite comprobar que carácter se encuentra en la posición pos del texto. Este método devolverá un string con dicho carácter. En caso de pasarle una posición que no existe, simplemente nos devolverá un string vacio "". El valor por defecto de pos es 0.

console.log('mar'.charAt(1)) // devuelve "a" 
console.log('mar'.charAt(3)) // devuelve "" 

La otra forma (introducida en ECMAScript 5) es tratar a la cadena como un objeto similar a un arreglo, donde los caracteres individuales corresponden a un índice numérico:

console.log('mar'[1]) // devuelve a "a"
console.log('mar'[3]) // devuelve undefined 

No obstante, es preferible utilizar el operador [] para obtener el carácter que ocupa una posición, ya que es más corto y rápido de utilizar y mucho más claro. La diferencia respecto a .charAt() es que el operador [] devuelve un undefined si en esa posición no existe ningún carácter.

Posición de cierto carácter

El método .indexOf(str, from) realiza la función <<opueta>> a .chartAt(). El método .indexOf(str) buscará el subtexto str dentro del string y nos devolverá un number con la posición de la primera aparición de dicho substring. En caso de no encontrarlo, devolvera un -1. El parámetro from es opcional, y es la posiciíon en la que empezará a buscar, que si no se suministra, es 0.

const frase = "Lenguaje de programación Javascript";

console.log(frase.indexOf("n"));          // 2
console.log(frase.indexOf("n", 3));       // 23
console.log(frase.indexOf("n", 24));      // -1

Posición desde el final

El método .lastIndexOf(str, from) funciona exactamente igual que el anterior, sólo que realiza la búsqueda partiendo desde el final de la cadena de texto hacia el principio, de modo que busca primero las última apariciones , en lugar de las primeras:

const frase = "Lenguaje de programación Javascript";

console.log(frase.lastIndexOf("n"));          // 23
console.log(frase.lastIndexOf("n", 3));       // 2
console.log(frase.lastIndexOf("n", 1));      // -1

De la misma forma, se devuelve -1 si no encuentra la ocurrencia, y el parámetro from es opcional, de indicarlo, se comenzará a buscar desde esa posición, hacia el principio del string.

Obtener fragmentos (substring)

javascript también posee una serie de métodos mediante los cuales podemos crear substrings formados por un fragmento del string original. Veamos de que métodos se trata:

Método Descripción Retorna
es2015 .repeat(num) Devuelve el string repetido la cantidad especificado en num. string
.substring(start, end) Devuelve el substring desde la posición start hasta end. string
.substr(start, size) Devuelve el substring desde la posición start hasta start+size. string
.slice(start, end) Identico a .substr() con leves diferencias. string

Repetir cadena de texto

Mediante el método .repeat() puedes repetir el texto del string exactamente el número de veces indicado por parámetro:

const text = "Mate";

console.log(text.repeat(4));     // "MateMateMateMate"
console.log(text.repeat(1));     // "Mate"
console.log(text.repeat(0));     // ""
console.log(text.repeat(-1));    // ERROR (Valor negativo)

Fragmentos de texto substring

Otras de las operaciones fundamentales de los string es la posibilidad de extraer fragmentos de texto de un string. Para ello, tenemos dos aproximaciones: el método substring() o el método substr().

  • El método substring(start, end) devuelve un string con el fragmento de texto desde la posición start hasta la posición end. Si se omite el parámetro end, el subtexto abarcará desde start hasta el final.

Veamos un ejemplo:

const text = "Submarino";

console.log(text.substring(3));    // 'marino' (desde el 3 en adelante)
console.log(text.substring(3, 5)); // 'ma'     (desde el 3, hasta el 5)
console.log(text.substr(3));       // 'marino' (desde el 3 en adelante)
console.log(text.substr(3, 5));    // 'marin'  (desde el 3, hasta el 3+5)
console.log(text.substr(-3));      // 'ino'    (desde la posición 3 desde el final, en adelante)
console.log(text.substr(-3, 2));   // 'in'     (desde la posición 3 desde el final, hasta 2 posiciones más)

Observa que el método .substr() con un valor negativo en su primer parámetro start, empieza a contar desde el final. Esto es algo que no ocurre con el método .substring().

Dividir un texto en partes (array)

Un método muy útil y versatíl es .split(text). Permite dividir un string por el substring text utilizándolo como separador las veces que haga falta. Como resultado, devolverá un array con cada una de las partes divididas. Es muy útil para crear arrays, o dividir textos que tienen separadores repetidos (comas, puntos, etc…) en varias partes:

Método Descripción Retorna
.split(str) Separa la cadena de texto en varias partes, usando el string str como separador. array
.split(str, limit) Identico al anterior, pero crea como máximo de limit fragmentos. array
.split(regexp) Separa el texto usando la regexp como separador. array
.split(regexp, limit) Identico al anterior pero crea como máximo de limit fragmentos. array

Veamos unos ejemplos indicando un string como separador:

console.log("88.12.44.123".split(".")); // ["88", "12", "44", "123"] (4 elementos)
console.log("1.2.3.4.5".split(".")); // ["1", "2", "3", "4", "5"] (5 elementos)
console.log("Hola a todos".split(" ")); // ["Hola", "a", "todos"] (3 elementos)
console.log("A,B,C,D,E".split(",", 3));    // ["A", "B", "C"] (limitado a los 3 primeros elementos)
console.log("Código".split(""));           // ["C", "ó", "d", "i", "g", "o"] (6 elementos)

Observa que en el último ejemplo, el separador es una cadena vacía, es decir, <<separar por la unidad más pequeña posible>>. Al indicar esto, split() realiza una división carácter por carácter.

Por otro lado, ten en cuenta que también es posible indicar una regexp como primer parámetro y no sólo un string, lo que permite realizar separaciones más versátiles y flexibles. Por lo demás, es exactamente igual a los ejemplos anteriores:

// Separa tanto por punto como por coma
console.log("88.12,44.123".split(/[.,]/));   // ["88", "12", "44", "123"] (4 elementos)

Un simple programador. Apasionado por las nuevas tecnologías, amante de la teoría de conjuntos.
← Anterior