T5.10 Trabajo con Arrays con programación estructurada

T5.10 Trabajo con arrays con programación extructurada:

ℹ️ Fuente original: repo de Brayan Diaz C

Un array en JavaScript es una estructura de datos que se utiliza para almacenar una colección de elementos, como números, cadenas de texto u objetos. Los elementos de un array están indexados numéricamente, comenzando desde cero. Es decir, el primer elemento se encuentra en la posición 0, el segundo en la posición 1, y así sucesivamente.

Para crear un array en JavaScript, se puede utilizar la siguiente sintaxis:

var miArray = []; // Crea un array vacío

O bien:

var miArray = new Array(); // Crea un array vacío

Para crear un array con elementos, se puede utilizar la siguiente sintaxis:

var miArray = [1, 'Hola', [3], true]; // Crea un array con tres elementos

O bien:

var miArray = new Array(1, 2, 3); // Crea un array con tres elementos

Es posible usar las palabras reservadas var, let o const para declarar un array. Por ejemplo:

var miArray = [1, 2, 3]; // Crea un array con tres elementos
let miArray = [1, 2, 3]; // Crea un array con tres elementos
const miArray = [1, 2, 3]; // Crea un array con tres elementos

Para acceder a un elemento de un array, se puede utilizar la siguiente sintaxis:

var miArray = [1, 2, 3]; // Crea un array con tres elementos
console.log(miArray[0]); // Muestra el primer elemento del array en la consola

Para modificar un elemento de un array, se puede utilizar la siguiente sintaxis:

var miArray = [1, 2, 3]; // Crea un array con tres elementos
miArray[0] = 4; // Modifica el primer elemento del array
console.log(miArray[0]); // Muestra el primer elemento del array en la consola

Otras formas de creación

let vector = Arrays.from(...); cuando viene de otro tipo de elemento, por ejemplo un HTMLCollection, objetos habituales al consultar por nodos del DOM.

También podemos crear arrays con let vector = [3, 4, 5]; o por desectructuración let salida = [1, 2, ...vector];

La desectructuración consiste en fragmentar un array en partes

let a, b, resto; 
[a, b, ...resto] = salida;

Buenas prácticas

• Utilizar const en lugar de let para declarar arrays que no serán modificados. De esta manera, se evita que el array sea reasignado accidentalmente y se hace más claro que el array no será modificado.
• Evitar la mutación directa de los elementos del array, especialmente cuando se trata de arrays anidados. En su lugar, utilizar métodos de array que no mutan el array original, como map(), filter(), reduce(), etc.
• Evitar el uso de bucles for para recorrer arrays. En su lugar, utilizar métodos de array como forEach(), map(), filter(), reduce(), etc. Estos métodos son más legibles y menos propensos a errores.
• Utilizar nombres descriptivos y legibles para los arrays y las variables que contienen arrays. Esto hace que el código sea más fácil de entender y depurar.
• Utilizar el método Array.isArray() para verificar si un valor es un array. Esto es más seguro que utilizar la comprobación de tipo typeof.
• Ser consciente de las operaciones costosas en términos de rendimiento en los arrays, como la reordenación y la eliminación de elementos. En su lugar, utilizar operaciones que sean más eficientes, como el método splice().

Siguiendo estas buenas prácticas con los arrays en JavaScript, podemos escribir código más legible, eficiente y menos propenso a errores sutiles.

Añadiendo / eliminando elementos

Ya conocemos algunos métodos que agregan o extraen elementos del inicio o final de un array:

arr.push(...items) – agrega ítems al final,
arr.pop() – extrae un ítem del final,
arr.shift() – extrae un ítem del inicio,
arr.unshift(...items) – agrega ítems al principio.

Fuente: es.javascript.info

Hay mas formas pero no serán necesarias de momento:

• splice
• slice
• concat
• ...

Trabajo con bucles for

// 0. Creamos el array
let numeros = [1, 2, 3, 4, 5, 6];

// 1. Mostrar
const mostrar = (vector) => { 
  salida = '';
  for(let v of vector){
    salida += v + ' ';
  }
  console.log( salida );
}
mostrar(numeros);

// 2. Transformar
const doblar = (entrada) => 2*entrada;
salidas = []
for(let k in numeros){
  salidas[k] = doblar(numeros[k]);
};
mostrar(salidas);

// 3. Filtrar
numeros = [1, 2, 3, 4, 5, 6];
salidas = []
const esPar = (entrada) => (entrada % 2 == 0); 
for(let i=0; i < numeros.length ; i++){
  console.log(i, numeros[i])
  if (esPar(numeros[i])) salidas.push(numeros[i])
};
mostrar(salidas);

// 4. Reducir
let suma = 0
const reductor = (num) => suma += num;
for(let v of numeros){
  reductor(v);
}
console.log( suma )

// 5. Alguno par?
console.log( numeros );
let algunoEsPar = false;
for(let v of numeros){
  if ( esPar(v) ) algunoEsPar = true;
}
console.log(`Alguno es par? ${algunoEsPar}`)

// 6. Todos pares?
console.log( numeros );
let todosSonPares = true;
for(let v of numeros){
  if ( !esPar(v) ) todosSonPares = false;
}
console.log(`Todos pares? ${todosSonPares}`)