Ir al contenido
wannacode

Arrays

En resumen: Un array es una secuencia de valores bajo un mismo nombre, en la que cada elemento tiene un número, su índice desde 0, y que crece con push.

Problema

Treinta notas

Una profesora escribe un programa para las notas de un examen. Para cinco estudiantes crea cinco variables:

const score1 = 62;
const score2 = 85;
const score3 = 47;
const score4 = 91;
const score5 = 78;
const sum = score1 + score2 + score3 + score4 + score5;
console.log(sum);
Salida
363

Pero en la clase hay treinta. Treinta variables, treinta sumandos. Y para la nota más alta hacen falta otras veintinueve comparaciones. El bucle de la lección anterior no ayuda: no puede recorrer score1, score2, score3, porque son nombres distintos. Necesitamos muchos valores bajo un solo nombre.

La idea

Un array: una fila de cajas

Un array (también llamado arreglo) es una fila de valores bajo un mismo nombre. Cada valor, un elemento del array, tiene un número: su índice. Los índices empiezan en 0.

const scores = [62, 85, 47, 91, 78];
console.log(scores[0]);
console.log(scores[4]);
console.log(scores.length);
scores[2] = 50;
console.log(scores[2]);
Salida
62
78
5
50
  • Los valores van entre corchetes [ ], separados por comas. No escribes ningún tipo. Puedes mezclar números y texto en un mismo array, pero normalmente todos los elementos son del mismo tipo.
  • scores[0] es el primer elemento, scores[4] el quinto. El último índice siempre es 1 menos que la cantidad.
  • scores.length es la cantidad de elementos. Aquí es 5.
  • scores[2] = 50; cambia un elemento. Los demás siguen igual.

Si todavía no conoces los valores, pero sabes cuántos son, creas un array con un tamaño y lo llenas de ceros:

const booked = new Array(3).fill(0);
booked[1] = 2;
console.log(booked);
Salida
[ 0, 2, 0 ]

A diferencia de los arrays de Java y C#, un array crece. push añade un elemento al final:

const scores = [62, 85];
scores.push(47);
console.log(scores);
console.log(scores.length);
Salida
[ 62, 85, 47 ]
3

console.log de un array entero muestra sus elementos entre [ ]. Es práctico para comprobar, pero para la salida del programa normalmente imprimes tú los elementos.

Más precisamente, para curiosos
  • new Array(3) sin .fill(0) no contiene ceros, sino tres huecos vacíos. Si lees uno de ellos, obtienes undefined, «sin valor»:
const booked = new Array(3);
console.log(booked);
console.log(booked[0]);
Salida
[ <3 empty items> ]
undefined
  • const delante del array significa que el nombre siempre apunta al mismo array. Sus elementos se pueden seguir cambiando y añadiendo.

Pruébalo

¿Cuál es cuál?

¿Qué imprimirá el programa?

const prices = [12, 7, 30, 5];
console.log(prices[1] + prices[3]);
Respuesta

La idea

Un bucle por el array

Ahora el bucle sí ayuda. El contador i se convierte en el índice: va de 0 hasta el último y en cada vuelta toma scores[i].

const scores = [62, 85, 47, 91, 78];
let sum = 0;
for (let i = 0; i < scores.length; i++) {
  sum += scores[i];
}
console.log(`Suma: ${sum}`);
console.log(`Media: ${sum / scores.length}`);
Salida
Suma: 363
Media: 72.6

La condición es i < scores.length, no un número. Si pones las treinta notas entre [ ], el bucle no cambia. Esto se llama recorrer el array.

En JavaScript / divide de forma exacta, así que la media sale 72,6 sin nada más.

Míralo

La nota más alta

¿Cómo encuentras el número más grande? Recuerdas el más grande hasta ahora y lo sustituyes en cuanto ves uno mayor.

const scores = [62, 85, 47, 91, 78];
let max = scores[0];
for (let i = 1; i < scores.length; i++) {
  if (scores[i] > max) {
    max = scores[i];
  }
}
console.log(max);  // 91
Paso a paso, en palabras
  1. Cinco puntuaciones, una al lado de otra. Los números de abajo son los índices: de 0 a 4.
  2. max empieza por la primera: scores[0] es 62.
  3. i = 1: 85 > 62, así que max pasa a ser 85.
  4. i = 2: 47 no es mayor que 85. No cambia nada.
  5. i = 3: 91 > 85, así que max pasa a ser 91.
  6. i = 4: 78 < 91. Luego i pasa a ser 5, 5 < scores.length es falso y el bucle se detiene.
  7. La puntuación más alta es 91.

max empieza por el primer elemento, no por 0. Si todas las notas fueran negativas, el 0 «ganaría» sin estar en el array. Por eso también el bucle empieza en i = 1: el primero ya está en max.

Pruébalo

Encuentra el error

El programa debería imprimir la suma 363. En cambio, imprime NaN.

¿En qué línea está el error?

Elige la línea con el error.

La idea

for … of: para cada elemento

Cuando solo necesitas los valores y no los índices, hay un bucle más corto. ¿Cuántos estudiantes aprobaron el examen (60 puntos o más)?

const scores = [62, 85, 47, 91, 78];
let passed = 0;
for (const score of scores) {
  if (score >= 60) {
    passed++;
  }
}
console.log(`Aprobaron el examen: ${passed}`);
Salida
Aprobaron el examen: 4

Se lee «para cada score de scores». En Java lo mismo se llama for-each. No hay contador ni índice, así que no te puedes salir del array. Es const porque score no cambia dentro de una vuelta: la siguiente vuelta recibe un score nuevo.

También tiene un límite: no sabes en qué índice estás y no puedes cambiar el elemento.

Más precisamente, para curiosos
  • Si escribes score = 0; en el cuerpo, el programa se detiene con TypeError, porque score es const. Con let score solo cambiaría la variable, y el array seguiría igual.
const scores = [62, 85, 47];
try {
  for (const score of scores) {
    score = 0;
  }
} catch (error) {
  console.log(`${error.name}: ${error.message}`);
}
Salida
TypeError: Assignment to constant variable.
  • También existe for … in, con in en lugar de of. No te da los elementos, sino los índices, y además como texto. Para los arrays, escribe for … of:
const scores = [62, 85, 47];
for (const i in scores) {
  console.log(i, typeof i);
}
Salida
0 string
1 string
2 string
  • Para cambiar elementos, o cuando necesitas el índice (por ejemplo, para el vecino scores[i + 1]), usa un for normal.

Pruébalo

Dos nombres, un array

¿Qué imprimirá el programa?

const prices = [10, 20, 30];
const sale = prices;
sale[0] = 5;
console.log(prices[0]);
Respuesta
Más precisamente, para curiosos

Una copia de verdad se hace con un array nuevo y un bucle:

const prices = [10, 20, 30];
const sale = [];
for (const price of prices) {
  sale.push(price);
}
sale[0] = 5;
console.log(prices[0], sale[0]);
Salida
10 5

[...prices] hace lo mismo:

const prices = [10, 20, 30];
const sale = [...prices];
sale[0] = 5;
console.log(prices[0], sale[0]);
Salida
10 5

Pruébalo

Ordena las líneas

El programa debe encontrar el precio más bajo. Ordena sus líneas.

  1. min = prices[i];
  2. let min = prices[0];
  3. if (prices[i] < min) {
  4. const prices = [18, 7, 25, 12];
  5. for (let i = 1; i < prices.length; i++) {
  6. }
  7. }
  8. console.log(min);

Ejercicio

Cálculos con un array

Resuelve los ejercicios en tu editor. Cada programa lee primero cuántos números hay y después los números, uno por línea:

const n = Number(await ask(""));
const numbers = [];
for (let i = 0; i < n; i++) {
  numbers.push(Number(await ask("")));
}

Arriba están las líneas para ask(), y al final rl.close(), como en la lección «Entrada y salida».

1. Suma, pares, impares. Imprime la suma de todos los números, la de los pares y la de los impares.

Entrada
3
1
2
3
Salida
Suma: 6
Pares: 2
Impares: 4

2. Al revés. Crea un array nuevo con los mismos números en orden inverso e imprímelo en una línea.

Entrada
5
1
2
3
4
5
Salida
5 4 3 2 1

3. Mínimo, máximo, media. Con una sola pasada por el array.

Entrada
5
4
9
2
7
4
Salida
Mínimo: 2
Máximo: 9
Media: 5.2

Ejercicio

Ordenar y contar

4. Ordenación. Ordena los números del más pequeño al más grande. Pista: recorre el array, y si dos vecinos están en el orden equivocado, intercámbialos (el intercambio es de la lección sobre variables). Repite hasta que no quede nada que intercambiar. Esto se llama ordenamiento de burbuja: los números grandes «suben como burbujas» hacia el final.

Entrada
5
42
7
19
3
25
Salida
3 7 19 25 42

5. La racha más larga. Encuentra la secuencia más larga de números iguales seguidos.

Entrada
8
2
2
5
5
5
1
5
5
Salida
El número 5, 3 veces seguidas

6. Estadística de notas. Lee notas del 2 al 6 e imprime cuántas hay de cada tipo. Pista: un array counts de 7 elementos, en el que la nota es el índice: counts[grade]++.

Entrada
8
6
4
5
6
3
2
6
5
Salida
Excelente (6): 3
Muy bien (5): 2
Bien (4): 1
Suficiente (3): 1
Insuficiente (2): 1

Más ejercicios

  • Mediana. El número del medio del array ordenado. Para 3, 1, 4, 1, 5 la mediana es 3. Si la cantidad de números es par, la mediana es la media de los dos del medio: para 7, 1, 3, 9 es (3 + 7) / 2 = 5.
  • Array simétrico. ¿Se lee igual de principio a fin que de fin a principio? 1 2 3 2 1 es simétrico, 1 2 3 1 no lo es.
  • Números romanos. Lee un número del 1 al 3999 e imprímelo en números romanos: 2024 es MMXXIV, 1994 es MCMXCIV. Pista: dos arrays en paralelo, con los valores 1000, 900, 500, 400, 100, …, 1 y con los símbolos "M", "CM", "D", "CD", "C", …, "I". Mientras el número sea al menos el valor actual, añade el símbolo y resta el valor.

Test

Ponte a prueba

1. En el array [62, 85, 47, 91, 78], ¿en qué índice está 91?
2. ¿Cuál es el índice del último elemento del array scores?
3. ¿Qué hay en el array justo después de const booked = new Array(3).fill(0);?
4. El array scores tiene 5 elementos. ¿Qué da scores[5]?
5. const sale = prices; sale[0] = 5; ¿Qué pasa con prices[0]?

Creado por Ivo Gergov como parte de la campaña de Evo Tech por una educación accesible en programación ·