Los Arrays en JavaScript

Los Arrays en JavaScript

En este bloque vamos a hablar de los Arrays (matrices, Arreglos o Vectores) y de todo los que nos permite hacer este objeto en JavaScript.

Un Array es una lista de contenedores asociados a un mismo nombre de variable. Anteriormente vimos el concepto de variables en JavaScript y como podemos almacenar datos en esta. Sin embargo, la diferencia entre estas y los Arrays es la posibilidad de almacenar múltiples valores bajo un mismo identificador.

En JavaScript podemos almacenar en los Array todos los datos que necesitemos sin tener que especificar el tipo ni la cantidad, cosa que si son obligadas en otros lenguajes de programación.

Entonces, ¿cómo creamos un Array en JavaScript?

JavaScript proporciona dos formas de crear un Array. El primero es usar el constructor del objeto Array :

var myArray = new Array();

La segunda forma es usar la notación literal del Array (tal vez la más preferida y usada por los desarrolladores):

var myArray = [];

Funcionalmente tenemos los mismos resultados al trabajar con cualquiera de las dos formas disponibles para crear Arrays, en si no existe una forma correcta o incorrecta para crearlos, pero en este apartado nos centraremos en la forma literal de creación de los Arrays.

La forma literal de un Array usa los corchetes [] para envolver una lista de elementos separados por comas. Por ejemplo, la siguiente declaración creamos un Array que contiene tres strings:

var colores = ["Amarillo", "Azul", "Rojo"];

También es posible crear Arrays vacíos dejando corchetes vacíos como lo vimos en el primer ejemplo o incluso crear Arrays con valores indefinidos como en el siguiente ejemplo:

var colores = [,,];

console.log(colores);
[undefined, undefined]

Y como mencionamos anteriormente, en un Array podemos almacenar y mezclar múltiples tipos de dato aceptos en JavaScript bajo un mismo identificador:

var valores = ["Amarillo", 4, true, myVariable];

Accediendo a los Elementos de un Array

Cuando creamos un Array cada elemento se coloca en una ubicación o índice, así que para acceder a los elementos de una Array utilizamos el nombre del Array seguido de los corchete [] y dentro de estos el numero del indice o posición del elemento al cual queremos acceder.

var colores = ["Rojo", "Verde", "Azul", "Amarillo", "Violeta"];

console.log(colores[0]);
console.log(colores[2]);
console.log(colores[4]);
console.log(colores[8]);
"Rojo"
"Azul"
"Violeta"
undefined

Cuando tratamos de acceder a una posición no definida en el Array este nos devuelve undefined como lo pudimos notar en el ejemplo anterior.

Un índice es el número correspondiente a un lugar donde se almacena un valor en un Array, siempre el primer elemento se ubica en el indice cero [0], el segundo en el indice uno [1] y así sucesivamente.


Cambiando los Elementos de un Array

Podemos usar los índices entre corchetes para establecer, cambiar o incluso agregar elementos a un Array. Por ejemplo, para reemplazar el primer elemento y agregar uno nuevo al último index del Array colores hacemos lo siguiente:

var colores = ["Rojo", "Verde", "Azul", "Amarillo", "Violeta"];

colores[0] = "Marrón";
colores[5] = "Lila"

console.log(colores);
["Marrón", "Verde", "Azul", "Amarillo", "Violeta", "Lila"]


Arrays multidimensionales

Los arrays multidimensionales no más que aquellos que contienes otros arrays entre sus elementos, es decir Arrays dentro de Arrays.

var miembros = [ ['Edwin', 1], ['Jose', 2], ['Edgar', 3] ];

Para acceder a un elemento de un Array multidimensional tendremos que ir escalando jerárquicamente los indices del Array, utilizamos el primer corchetes para acceder a un elemento de la matriz externa que devuelve una matriz interna; y el uso de otro corchete para acceder al elemento de la matriz interna.

var miembros = [ ['Edwin', 1], ['Jose', 2], ['Edgar', 3] ];

console.log(miembros[2]);
console.log(miembros[2][0]);
"Edgar", 3
"Edgar"

De la misma forma que vimos anteriormente para modificar u añadir elementos a un Array simple lo podemos hacer en un Array multidimensional, lo único a tener presente es la jerarquía de indices para accesar a dichas posiciones.


En los siguientes apartados veremos más de los Arrays, Operaciones básicas, sus propiedades y sus métodos.