Saltar al contenido

Arrays de JavaScript

Introducción a los arrays de JavaScript

Los arrays de JavaScript son colecciones versátiles y ordenadas que pueden almacenar una variedad de elementos, incluidos números, cadenas y objetos. Ofrecen una forma flexible de agrupar y gestionar datos en tus aplicaciones.

Creación e inicialización de arrays

Hay varias formas de crear arrays en JavaScript. El método más común es usar la sintaxis de literal de array:


javascript
let fruits = ["Apple", "Banana", "Cherry"];

Como alternativa, puedes inicializar un array usando el constructor new Array(), aunque esto es menos común:


javascript
let fruits = new Array("Apple", "Banana", "Cherry");

Métodos y propiedades de los arrays

Los arrays de JavaScript vienen con un conjunto de métodos y propiedades integrados que facilitan la manipulación de los datos.

INFO

Encuentra más funciones integradas en JavaScript Array Methods

Agregar y eliminar elementos

  • push(): Añade uno o más elementos al final de un array y devuelve la nueva longitud.

Output appears here after Run.
  • pop(): Elimina el último elemento de un array y devuelve ese elemento.

Output appears here after Run.
  • unshift(): Añade uno o más elementos al principio de un array y devuelve la nueva longitud.

Output appears here after Run.
  • shift(): Elimina el primer elemento de un array y devuelve ese elemento.

Output appears here after Run.

Acceder e iterar sobre elementos

  • length: Esta propiedad devuelve el número de elementos de un array.
  • forEach(): Este método ejecuta una función proporcionada una vez por cada elemento del array.

Output appears here after Run.
  • map(): Crea un nuevo array con los resultados de llamar a una función proporcionada sobre cada elemento del array que llama.

Output appears here after Run.

Operaciones avanzadas con arrays

Arrays multidimensionales

Los arrays de JavaScript pueden almacenar otros arrays, lo que permite la creación de arrays multidimensionales.


Output appears here after Run.

Operador spread y desestructuración

Operador spread

El operador spread (...) en JavaScript permite expandir un iterable (como un array o una cadena) en lugares donde se esperan múltiples elementos o argumentos. Es increíblemente versátil para manipular arrays.

  • Combinar arrays:

Output appears here after Run.
  • Copiar arrays:

Output appears here after Run.
  • Uso con funciones:

Output appears here after Run.
Desestructuración

La desestructuración en JavaScript te permite desempaquetar valores de arrays o propiedades de objetos en variables distintas.

  • Desestructuración de arrays:

Output appears here after Run.
  • Intercambio de variables:

javascript
let a = 1, b = 2;
[a, b] = [b, a];   // a becomes 2, b becomes 1
console.log(a, b);
  • Valores predeterminados:

Output appears here after Run.

Tanto el operador spread como la desestructuración mejoran la legibilidad y la eficiencia del código JavaScript, permitiendo patrones de programación más concisos y expresivos.

Métodos de callback de arrays

Métodos como filter, reduce y some ofrecen formas potentes de procesar y evaluar los datos en arrays. Estos métodos toman una función de callback como argumento y pueden realizar una variedad de operaciones complejas.

  • filter(): Crea un nuevo array con todos los elementos que pasan la prueba implementada por la función proporcionada.

Output appears here after Run.

Ordenación y búsqueda en arrays

  • sort(): Ordena los elementos de un array in situ y devuelve el array ordenado.

WARNING

De forma predeterminada, sort() convierte los elementos en cadenas y los ordena lexicográficamente. Para números, esto puede producir resultados inesperados (por ejemplo, 10 aparece antes que 2). Proporciona siempre una función de comparación para ordenar números.


Output appears here after Run.
  • find() and findIndex(): Se usan para buscar un elemento en el array.

Output appears here after Run.

Convertir arrays en cadenas

El método join() combina todos los elementos de un array en una sola cadena.


Output appears here after Run.

Mejores prácticas para usar arrays en JavaScript

  • Usa const para declarar arrays que no se reasignan.

Usar const para declarar arrays es una buena práctica. Evita la reasignación del identificador del array, garantizando que la referencia al array permanezca constante. Sin embargo, el contenido del array todavía puede modificarse.


Output appears here after Run.

Esto garantiza que fruits siempre hará referencia al mismo array, pero no significa que el array en sí sea inmutable.

  • Prefiere métodos funcionales como map, filter y reduce para operaciones sobre arrays.
  • Utiliza funciones de ES6 como el operador spread y la desestructuración para un código más conciso y legible.

Conclusión

Los arrays de JavaScript son un aspecto fundamental del lenguaje y proporcionan un sólido conjunto de funciones para manejar colecciones de datos. Al comprender los métodos y propiedades de los arrays, y seguir las mejores prácticas, puedes gestionar y manipular eficazmente los datos de arrays en tus aplicaciones de JavaScript.

Practice

Which of the following are ways to declare an array in JavaScript?

¿Te resulta útil?

Vista previa dual-run — compárala con las rutas Symfony en producción.