16. JS, Objeto Array - PropiedadesGeneralidades y propiedades del objeto Array en JavaScript

El uso de los Arrays es muy utilizado en programación, se utiliza para almacenar varios valores en una única variable. Sus valores pueden ser de cualquier tipo, ya sea numérico, string, objetos e incluso otros Arrays.

Creación de Arrays

Hay varias formas de crear tus Arrays:

Método literal con x elementos

var frutas = ["pera", "manzana", "naranja"];

Método literal sin elementos

var frutas = [];

Esta es la forma más recomendable, ya que es muy ágil y internamente es más rápida.

Nuevo Array iniciandolo

var frutas = new Array("pera", "manzana", "naranja");

Nuevo Array sin elementos

var frutas = new Array();

De todas las formas, esta es la más lenta, ya que el sistema tarda más en llevarlo a cabo.

Nuevo Array con x elementos

var frutas = new Array(4);

Aquí sólo declaras la cantidad de elementos que tendrá el Array frutas. Cada uno de los cuatro espacios contendrá el valor undefined. Que indica que el espacio está reservado, pero sin un valor definido.

Acceso a los valores del Array

A la hora de trabajar con Arrays, tienes que tener siempre presente que el primer índice o posición es siempre 0. Es decir, la primera celda donde se almacena el primer valor es el índice 0 (primer posición).

var frutas = ["pera", "manzana", "naranja"];
// Posición 1 = "pera" = índice 0
// Posición 2 = "manzana" = índice 1
// Posición 3 = "naranja" = índice 2

Para acceder, por ejemplo, a la primera posición del Array, accederás con la siguiente línea de código:

alert(frutas[0]);
document.write(frutas[0]);

Mostrar todos los valores del Array

La forma manual de acceder a los elementos del Array es un engorro, poco efectiva y muy difícil de hacer cuando tenemos muchos elementos. Por lo que puedes recurrir a las instrucciones iterativas del lenguaje.

Hay varias formas de mostrar o acceder a los valores de un Array:

Sentencia simple for

La sentencia for es la más rudimentaria, pero es la más antigua. Requiere que conozcas internamente como se realiza el esquema de recorrido for.

var frutas = ["pera", "manzana", "naranja"];
for (var i = 0; i < 3; i++) {
   document.write(frutas[i]  + "<br/>" );
}

En este ejemplo, he puesto el número final de iteraciones ya que sé el número de elementos que tiene el Array, ¿pero y si no lo sabes?

Para solucionar ese problema, el objeto Array dispone de una propiedad llamada length que guarda el número de elementos que tiene el Array y que puedes usar para acabar tus iteraciones. Te muestro el código mejorado:

var frutas = ["pera", "manzana", "naranja"];
for (let i = 0; i < frutas.length; i++) {
   document.write(frutas[i]  + "<br/>" );
}

Como ves ya no te hace falta saber el número de elementos que tiene un Array, porque siempre estará almacenada en la propiedad length.

Otro cambio es la declaración de la variable i. En vez de utilizar la palabra reservada var he hecho servir let. La diferencia es que let tiene un ámbito más estricto, es decir, cuando sale del bucle for, la variable se destruye.

Sentencia for...in

Con esta sentencia se consigue que sea más sencillo y que tu código quede más optimizado al interactuar con los Arrays y no hace falta que conozcas el funcionamiento de recorrido.

var frutas = ["pera", "manzana", "naranja"];
for (let i in frutas) {
   document.write(frutas[i]  + "<br/>" );
}

Aquí no hace falta que utilices la propiedad length, porque el sistema ya hace el trabajo por ti.

Nota: Hay una tercera forma de recorrer un Array. Es el método foreach, pero el concepto es bastante más avanzado. Más adelante lo veremos.

Arrays multidimensionales

Un Array multidimensional es un Array que contiene otros Arrays en su interior.

var alimentos = ["platanos", "lechuga", "atún", "pollo", "nueces", "manzanas"];
var clases = ["fruta", "verdura", "carne", "pescado", "frutos secos"];
var cocina = [clases, alimentos];

document.write( cocina[2][3] ); // Salida: pescado 

Propiedades del objeto Array

El objeto tiene una serie de propiedades o características que contienen datos para poder trabajar con él.

length

Igual que para los objetos String, los Arrays también tiene la propiedad length, la cual almacena en todo momento el número de elementos que contiene la matriz o array.

var clientes = new Array(1000);
alert(clientes.length); // Salida: 1000

Aunque el Array este vacio, tiene asignados 1000 elementos con el valor undefined

prototype

La propiedad prototype te permite añadir propiedades y métodos personalizados.

var platanos = new Array(); // Declaración Array
platanos.prototype.colorMaduro = "amarillo"; // Asignación de propiedad
document.write(platanos.colorMaduro); // Mostrar valor propiedad

Si te ha gustado este artículo y quieres saber más, visita métodos de búsqueda y creación del objeto Array en JavaScript 

Si te ha gustado o te ha aclarado conceptos el contenido de este artículo compártelo en redes sociales para que pueda crecer, ¡Muchas gracias!