Mutables o no primitivos

Arrays, vectores, listas o matrices

Nos permiten guardar una colección de datos primitivos o no primitivos.

Consideraciones

A la hora de hablar de este tipo de datos tenemos que tener claro dos conceptos:

  1. Índice. La posición en que se encuentra cada uno de los datos del array. El primer elemento empieza por cero
  2. Elemento de un array. El contenido propio de cada una de la posiciones del array
const nombres = ['Xurxo', 'Jorge', 'George']
const indice = 2

console.log(`${nombres[indice]} se encuetra en la posición ${indice}`) // >> 'George se encuetra en la posición 2'

Inicialización sin datos

// Inicializar una lista, vector o array
const newArray = []
// Otra forma alternativa para inicializar un array a través de un instancia
const otherArray = new Array()
// Si quieres definir un array con un tamaño determinado
const arrayWithThreeItems = new Array(3)

Inicialización con datos

// Array con datos
const names = ['Xurxo', 'Irene', 'Manuel']

Si queremos ver formas más avanzadas podemos ver Cómo inicializar Array con valores en JavaScript

Propiedades sobre Arreglos (también llamados arrays o vectores)

  1. Propiedad que indica el tamaño de un array
numeros.length // >> 3

Formas tradicional de recorrer un array: ciclo for

const nombres = ['Xurxo', 'David', 'Rebeca', 'Mónica']
for (let i = 0; i < nombres.length; i++) {
  console.log(nombres[i]) // >> 'Xurxo', 'David', 'Rebeca', 'Mónica'
}
console.log(`Hay ${nombres.length} personas.`) // >> 'Hay 4 personas.'

Métodos tradicionales empleados sobre arrays

Partamos del siguiente ejemplo:

const numeros = [0, -1 , 1]

Métodos sobre Arreglos (también llamados arrays o vectores)

  1. Método para añadir un elemento al array
numeros.push(0) // >> [0, -1, 1, 0]
numeros.push(22) // >> [0, -1, 1, 0, 22]
  1. Método para eliminar el último elemento de un array
const removedItem = numeros.pop() // >> [0, -1, 1, 0]
console.log(removedItem) // >> 22
  1. Método para concatenar elementos de un array con un separador
numeros.join('❤️') // >> '0❤️-1❤️1❤️0'

A CONTINUACIÓN VEREMOS MÉTODOS AVANZADOS EN LOS ARRAYS

  1. array.prototype.reduce(): función reductora sobre cada elemento de un array, devolviendo como resultado un único valor. Podemos ver más informacion en MDN

Deseamos obtener la suma total de los elementos contenidos en el siguiente array:

const numeros = [1, 2, 3, 4]

Con un ciclo for y un acumulador podríamos obtener la suma total de los números del array:

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

console.log(numeros.join('+'),'=',addedNumbers) // >> '1+2+3+4' '=' 10

Podríamos obtener el mismo resultado con un método o función reductora:

const addedNumbers = numeros.reduce((accumulator, currentValue) => {
  return accumulator + currentValue
}) // Nótese que en la variable accumulator no me hizo falta iniciarlo a cero

console.log(numeros.join('+'),'=',addedNumbers) // >> '1+2+3+4' '=' 10

Otro ejemplo. Para calcular cúantos número positivos, negativos o ceros que hay en un array podemos realizarlo utilizando un lenguaje imperativo:

const numeros = [0, 0, -3, 4]

let pos = 0
let neg = 0
let zer = 0

for (let i = 0; i < numeros.length; i++) {
  if (numeros[i] > 0) pos++
  else if (numeros[i] < 0) neg++
  else zer++
}

console.log('Positives:',pos, 'Negatives:', neg, 'Zeros:',zer) // >> 'Positives:' 1 'Negatives:' 1 'Zeros:' 2

O de manera declarativa:

// contadores: [positives, negatives, zeros]
const contadores = numeros.reduce((previousValue, currentValue) => {
  if (currentValue > 0) previousValue[0]++
  else if (currentValue < 0) previousValue[1]++
  else previousValue[2]++
  return previousValue
}, [0,0,0])

console.log('Positives:',contadores[0], 'Negatives:', contadores[1], 'Zeros:',contadores[2]) // >> 'Positives:' 1 'Negatives:' 1 'Zeros:' 2
  1. array.prototype.map

Nos permite iterar sobre cada elemento de un array y devolver un nuevo array con las operaciones realizada:

const edades = [18, 15, 13, 1]

const mayorMenorEdades = edades.map((value) => {
  return value >= 18 ? 'Mayor de edad: ' + value : 'Menor de edad: ' + value
})

console.log(mayorMenorEdades) // >> [ 'Mayor de edad: 18', 'Menor de edad: 15', 'Menor de edad: 13', 'Menor de edad: 1' ]