Funciones útiles para trabajar con arrays en JavaScript

En este artículo vas a ver que son los arrays y descubrir las funciones más interesantes para trabajar con arrays en JavaScript.

Un arreglo son datos que pertenecen a un mismo grupo, por así decirlo, vas a ver como se crean en JavaScript, sus métodos, como acceder a sus propiedades, como quitar, etc.

¿Como crear un array en JavaScript?

Crear un arreglo en JavaScript es muy sencillo. A continuación vas a ver 2 formas para conseguirlo:

Crear un array en JavaScript con el método clásico

const meses = ['Enero', 'Febrero', 'Marzo', 'Abril'];

Crear un array en JavaScript con el método orientado a objetos

const meses = new Array('Enero', 'Febrero', 'Marzo', 'Abril');

De estas 2 formas, se consigue lo mismo. Un arreglo de unos cuantos meses del año.

A la hora de crear un arreglo, es posible indicar distintos valores para los elementos del array.

Es posible mezclar los datos dentro del mismo array.

Por ejemplo, en un arreglo puedes tener elementos de tipo cadena, números, boleanos, etc.

Funciones y métodos para los arrays en JavaScript

Los arrays en JavaScript tienen sus propios métodos. A continuación vas a descubrir las funciones más útiles e interesantes que dan respuesta a las siguientes cuestiones:

¿Cómo saber la longitud de un array?

El método length retorna el número de elementos que hay en un arreglo.

Para saber el número de meses que hay en el array de ejemplo, es posible mostrarlo en consola de la siguiente forma:

console.log('Numero de meses: ' + meses.length);

En este caso, en la consola se mostraría un 4.

¿Cómo saber si un elemento es un array?

El método isArray se puede utilizar para saber si un elemento es un array.

Se puede utilizar en un condicional de la siguiente forma:

if (Array.isArray(meses)) {
    console.log('Es un array');
} else {
    console.log('No es un array');
}

El método isArray retorna true si es un arreglo o false si no lo es.

¿Cómo agregar un elemento a un array?

Agregar un elemento a un array se puede hacer de la siguiente forma:

meses[4] = 'Mayo';

En la posición 4 del array meses que hemos creado al inicio, agregamos Mayo.

Esta forma es correcta pero, debes saber que hay una mejor forma de hacerlo utilizando el método push que permite insertar elementos al final del arreglo.

Para agregar el mes de «Junio» en el arreglo de meses, es posible hacer:

meses.push('Junio');

¿Cómo agregar un elemento al inicio del array?

El método unshift permite agregar un elemento al inicio de un arreglo.

meses.unshift('Primer elemento');

Esto no reemplaza el mes de Enero. Lo que hace es situar en la posición 0 el mes «Primer elemento» y el resto de elementos se desplazan de posición.

¿Cómo encontrar un elemento en un array?

El método indexOf se utiliza para encontrar un elemento en un arreglo. Revisa si existe y retorna la posición dentro del arreglo.

console.log(meses.indexOf('Abril'));

Esto retorna la posición 4.

¿Cómo eliminar un elemento de un array?

El método pop permite eliminar un elemento de un arreglo.

La llamada sería así:

meses.pop();

Esto elimina el último elemento del array. En el caso del ejemplo está eliminando «Junio».

¿Cómo eliminar el primer elemento de un array?

El método shift elimina el elemento situado en la primera posición del arreglo.

La llamada sería así:

meses.shift();

En el caso del ejemplo esto lo que hace es eliminar el elemento «Primer elemento» que se agregó con unshift.

¿Cómo eliminar un rango de elementos de un array?

El método splice permite quitar un rango de elementos del arreglo. Se puede utilizar para quitar un elemento del medio o varios.

Por ejemplo, para quitar «Marzo» del array, sería:

meses.splice(2, 1);

Para eliminar 2 elementos seguidos desde la posición 2, sería:

meses.splice(2, 2);

El primer parámetro del método splice indica la posición a partir del cual deseas eliminar elementos.

El segundo parámetro indica el número de elementos que se borrarán.

¿Cómo revertir los elementos de un array?

El método reverse cambia el orden de los elementos del array invirtiendo sus posiciones.

La llamada sería así:

meses.reverse();

¿Cómo unir 2 arrays?

El método concat permite unir un arreglo con otro.

Fíjate en el siguiente ejemplo:

const semestre1 = new Array('Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio');
const semestre2 = new Array('Julio', 'Agosto', 'Setiembre', 'Octubre', 'Noviembre', 'Diciembre');
 
console.log(semestre1.concat(semestre2));

En el código anterior he creado 2 arrays.

El array semestre1 contiene los 6 primeros meses del año.

El array semestre2 contienen los 6 últimos meses del año.

La función concat permite hacer la unión de los 2 arrays en uno solo.

El resultado en consola sería el siguiente:

["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Setiembre", "Octubre", "Noviembre", "Diciembre"]

¿Cómo ordenar un array de cadenas?

El método sort permite ordenar un array por orden alfabético.

Fíjate en la siguiente rutina:

const meses = new Array('Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Setiembre', 'Octubre', 'Noviembre', 'Diciembre');
meses.sort();
console.log(meses);

Este código muestra en la consola el array ordenado de la siguiente forma:

["Abril", "Agosto", "Diciembre", "Enero", "Febrero", "Julio", "Junio", "Marzo", "Mayo", "Noviembre", "Octubre", "Setiembre"]

¿Cómo ordenar un array de números?

La función sort no funciona correctamente a la hora de ordenar números de forma básica pero, permite pasar una función como parámetro para crear nuestra función propia que permite ordenar los números.

Partimos del siguiente array de números:

numeros = [1,3,9,91,23,45,6,98,90,12];

Para ordenar los elementos del array numeros en formato ascendente podemos hacer lo siguiente:

numeros.sort(function (a,b) {
    return a-b;
});
console.log(numeros);

En la consola aparecerá el array ordenado de menor a mayor.

Para ordenar los elementos del array numeros en formato descendente podemos hacer lo siguiente:

numeros.sort(function (a,b) {
    return b-a;
});
console.log(numeros);

En la consola aparecerá el array ordenado de mayor a menor.

De esta forma, puedes mejorar un poco la función que permite ordenar en JavaScript.

Conclusiones

Estas son las funciones y métodos más útiles e interesantes para trabajar con arrays en JavaScript.

Estos métodos se utilizan bastante y, si eres programador web, es muy interesante que tengas conocimientos sobre ellos ya que te pueden ahorrar mucho trabajo y esfuerzo.

Espero que te resulte interesante disponer del conocimiento de estas funciones que te permitirán coger habilidad para leer código de otros programadores o para pensar con más claridad y crear tus rutinas relacionadas con arrays en JavaScript de forma más eficiente.

Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Te ha servido? Valora esta entrada!
1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (2 votos, promedio: 5,00 de 5)
Cargando…
Comparte en las redes sociales

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ver más sobre