Arrays JavaScript Diseño y Desarrollo web en Bolivia y el Mundo

Arrays

Los objetos permiten almacenar colecciones de datos mediante nombres, lo cual es útil en muchos casos. Sin embargo, cuando necesitamos una colección ordenada, como una lista de usuarios, productos o elementos HTML, los objetos no son ideales porque no manejan bien el orden de los elementos.

Para esto, utilizamos los arrays, también conocidos como arreglos, matrices o vectores.

Declaración

Podemos crear un array vacío de dos formas:

				
					let arr = new Array();
let arr = [];

La segunda forma es la más común. Podemos inicializar el array con elementos:

Otra ventaja de los backticks es que permiten extender una cadena en múltiples líneas:

				
					let fruits = ["Apple", "Orange", "Plum"];

Los elementos del array están numerados desde cero. Podemos acceder a un elemento específico utilizando su índice:

				
					let fruits = ["Apple", "Orange", "Plum"];

alert(fruits[0]); // Apple
alert(fruits[1]); // Orange
alert(fruits[2]); // Plum

Podemos reemplazar un elemento:

				
					fruits[2] = 'Pear'; // ahora ["Apple", "Orange", "Pear"]

O agregar uno nuevo al final del array:

				
					fruits[3] = 'Lemon'; // ahora ["Apple", "Orange", "Pear", "Lemon"]

La propiedad length nos da la cantidad total de elementos en el array:

				
					let fruits = ["Apple", "Orange", "Plum"];

alert(fruits.length); // 3

Podemos mostrar todo el array:

				
					let fruits = ["Apple", "Orange", "Plum"];

alert(fruits); // Apple,Orange,Plum

Un array puede contener elementos de cualquier tipo:

				
					let arr = ['Apple', { name: 'John' }, true, function() { alert('hello'); }];

alert(arr[1].name); // John
arr[3](); // hello

Coma final

Un array puede tener una coma al final para facilitar la adición o eliminación de elementos:

				
					let fruits = [
  "Apple",
  "Orange",
  "Plum",
];

Obtener los últimos elementos con `at`

Podemos obtener el último elemento de un array usando at(-1):

				
					let fruits = ["Apple", "Orange", "Plum"];

alert(fruits.at(-1)); // Plum

Métodos `pop` y `push`, `shift` y `unshift`

Estos métodos permiten agregar o quitar elementos del array.

pop elimina y devuelve el último elemento:

				
					let fruits = ["Apple", "Orange", "Pear"];

alert(fruits.pop()); // Pear
alert(fruits); // Apple, Orange

push agrega un elemento al final:

				
					let fruits = ["Apple", "Orange"];

fruits.push("Pear");

alert(fruits); // Apple, Orange, Pear

shift elimina y devuelve el primer elemento:

				
					let fruits = ["Apple", "Orange", "Pear"];

alert(fruits.shift()); // Apple
alert(fruits); // Orange, Pear

unshift agrega un elemento al principio:

				
					let fruits = ["Orange", "Pear"];

fruits.unshift('Apple');

alert(fruits); // Apple, Orange, Pear

Arrays como pilas o colas

Los arrays en JavaScript pueden funcionar como pilas (LIFO) o colas (FIFO). push y pop operan en el final del array, mientras que shift y unshift operan en el principio.

Rendimiento

Los métodos push y pop son más rápidos que shift y unshift porque no necesitan mover elementos.

Bucles

Podemos iterar sobre un array con un bucle for tradicional o con for..of:

				
					let arr = ["Apple", "Orange", "Pear"];

for (let i = 0; i < arr.length; i++) {
  alert(arr[i]);
}

for (let fruit of arr) {
  alert(fruit);
}

Propiedad `length`

La propiedad length se ajusta automáticamente. Podemos truncar un array ajustando length:

				
					let arr = [1, 2, 3, 4, 5];

arr.length = 2; // [1, 2]

Arrays multidimensionales

Podemos crear arrays dentro de arrays para representar estructuras más complejas, como matrices:

				
					let matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

alert(matrix[1][1]); // 5

toString

El método toString de un array devuelve una cadena de sus elementos separados por comas:

				
					let arr = [1, 2, 3];

alert(arr); // 1,2,3

Comparación de arrays

No compares arrays con ==. Siempre son diferentes a menos que sean el mismo objeto:

				
					alert([] == []); // falso
alert([0] == [0]); // falso

Para comparar arrays, compara elemento por elemento.

Resumen

Los arrays son útiles para almacenar colecciones ordenadas. Pueden ser manipulados con métodos como push, pop, shift y unshift. Iteramos sobre ellos con bucles for o for..of. Evita usar for..in y la comparación == con arrays.

Arrays JavaScript

Coma final

Obtener los últimos elementos con at

Métodos pop y push, shift y unshift

Arrays como pilas o colas

Rendimiento

Bucles

Propiedad length

Arrays multidimensionales

toString

Comparación de arrays

Resumen

Related Post

Unicode y la Interna de Strings en JavaScript

BigInt en JavaScript

Tipo de Referencia en JavaScript

Currificación en JavaScript

Usando eval para ejecutar una cadena de código

Deja una respuesta Cancelar la respuesta

Obtener los últimos elementos con `at`

Métodos `pop` y `push`, `shift` y `unshift`

Propiedad `length`