Array desesctructuring
Basics de arrays
New Array
let newArray
newArray = Array.of(2,3,4,5,'array') // [2,3,4,5,'array']
newArray = []
newArray = [2,3,4,5,'array']
Info del array
// numero de cuantos elementos tiene
cuantos = [1,2,3,4].length // 4
// elimina y retorna la primer posicion, y edita el array original
arrayEse = [1,2,3,4,5] // [2,3,4,5]
first = arrayEse.shift() // 1
// elimina y retorna la ultima posicion, y edita el array original
arraicito = [1,1,1,1,40] // [1,1,1,1]
last = arraicito.pop() // 40
// agrega elementos al final del array
arraicito.push(30) // [1,1,1,1,30]
// agrega elementos al inicio del array
arraicito.unshift(40) // [40,1,1,1,1,30]
// array to string, retorna un string
palabras = ['hola', 'como', 'estas', '?']
frase = palabras.join(' ') // 'hola como estas'
// si array contiene este valor, retorna un boolean
loContiene = palabras.includes('como') // true
// obtiene la posicion a partir del index
elIndex = palabras.indexOf('como') // si no existe regresa -1
// elimina posiciones en el array y setea nuevos valores en el, retornando lo eliminado
// ve al index 3, elimina "?" elemento y agrega '!'
elementoEliminado = palabras.splice(3, 1, '!')
elementoEliminado // ['?']
palabras // ['hola', 'como', 'estas', '!']
// retorna un elemento recortado sin editar el original
mismoArray = palabras.slice() // no recorta nada
partArray = palabras.slice(2) // recorta a partir del index 2 a la derecha
toArray = palabras.slice(1,5) // del ix 1 al previo al 5
// retorna el primer valor que returne true en la iteracion, ejecuta una funcion para encontrarlo
const found = palabras.find(x => x == '?') // '?'
Iteraciones en el array
/* REDUCE
itera sobre si mismo
pisa en cada iteracion el valor del primer parametro
la ultima iteracion retorna el valor del primer parametro
puedes declarar el valor inivial del primer parametro
*/
listaDeNumeros = [1,1,1,1,1,1]
resultado = listaDeNumeros.reduce((last,current,index, all) => {
return last + current
}, 0) // 6
/* FILTER
itera sobre si mismo
genera un nuevo array como respuesta
para agregar una posicion al nuevo array hay que retornar un true
*/
listaDeNumeros = [10,23,12,02,80]
personasMayores = arreglo.filter((item, index, all) => {
return item > 18
}) // [23,80]
/* EVERY
itera sobre si mismo
verifica que todos los elementos pasen una u otra condicion
cada iteracion retornaria un true o false
el retorno final regresa un boleano, dependiendo si todo cumple o no
*/
listaDeNumeros = [10,23,12,02,80]
booleano = arreglo.every((current, index, all) => {
return current === all[0]
}) // false
/* MAP
itera sobre si mismo
da un nuevo valor a la posicion en cada iteracion
al final retorna un array totalmente nuevo
*/
arr = [10,23,12,02,80]
nuevo_array = arr.map((currentValue, index, array) {
return currentValue + 10
})
/* I
itera sobre si mismo
da un nuevo valor a la posicion en cada iteracion
al final retorna un array totalmente nuevo
*/
arr = [10,23,12,02,80]
nuevo_array = arr.map((currentValue, index, array) {
return currentValue + 10
})
Math en el array
/*
Los metodos de Math no funcionan si les mandas un array,
por lo que deberias mandares solo los valores del array con el spread iterator.
Esto lo puedes repetir en cualquier metdo de math que reciba varios elementos.
*/
const arrMax = arr => Math.max(...arr);
arrMax([1,2,3,4,5]) // return 5
Object to array
const zoo = {
lion: '🦁',
panda: '🐼',
};
Object.keys(zoo);
// return ['lion', 'panda']
Object.values(zoo);
// return ['🦁', '🐼']
Object.entries(zoo);
// return [ ['lion', '🦁'], ['panda', '🐼'] ]
Array.from(zoo)
// return ['🦁', '🐼']
console.log(Array.from([1, 2, 3], x => x + x));
// expected output: Array [2, 4, 6]´GB<<BHBG4G4RLHPGLA¿WP0E'YH
Array.from
// crea array desde objetos iterables, y transforma su valor
// string to array
Array.from('foo');
// return [ "f", "o", "o" ]
// object to array
f = () => Array.from(arguments)
f(1, 2, 3);
// return [ 1, 2, 3 ]
// number to array
// primero combierte todo a string y luego itera en cada numero
// retornandolo en tipo numero
Array.from(String(123123), num => Number(num))
// return [1,2,3,1,2,3]
// array to another array
// esto es muy parecido a un map, donde se itera y se retorna el nuevo valor
Array.from([1, 2, 3], x => x + x);
// return [2, 4, 6]
// length:5 esta declarando el tamanio del array
// v es el ultimo valor retornado, que al iniciar es undefinded
// i es el index de cada iteracion
Array.from({length: 5}, (v, i) => i);
// [0, 1, 2, 3, 4]