Arrays: a lista de chamada

Criar e acessar

const alunos = ["Ana", "João", "Maria"];

console.log(alunos[0]); // → "Ana"
console.log(alunos[2]); // → "Maria"
console.log(alunos[9]); // → undefined
console.log(alunos.length); // → 3
console.log(alunos[alunos.length - 1]); // → "Maria", o último
console.log(alunos.at(-1)); // → "Maria", mais direto

O índice começa em zero. Por isso o último é length - 1: e at(-1) é o atalho moderno para ele.

Uma lista pode guardar qualquer coisa, inclusive objetos:

const precos = [1250, 2500, 800];
const misturado = ["Ana", 15, true];
const produtos = [
  { nome: "Farinha", precoEmCentavos: 1250 },
  { nome: "Açaí", precoEmCentavos: 2500 },
];

Acrescentar e remover

const lista = ["Ana", "João"];

lista.push("Maria"); // no fim       → ["Ana", "João", "Maria"]
lista.unshift("Carlos"); // no começo    → ["Carlos", "Ana", "João", "Maria"]

const ultimo = lista.pop(); // tira do fim e devolve
const primeiro = lista.shift(); // tira do começo e devolve

Os quatro alteram a lista original.

Alterar ou copiar: a distinção que importa

const original = [3, 1, 2];

// Altera o original
original.sort();
original.reverse();
original.push(4);
original.splice(1, 1);

// Devolve uma nova, sem tocar no original
const pedaco = original.slice(0, 2);
const junto = original.concat([5, 6]);
const outra = [...original];

slice e splice são uma letra de diferença e fazem coisas opostas; e isso causa defeito de verdade:

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

console.log(numeros.slice(1, 3)); // → [2, 3]     numeros continua [1,2,3,4,5]
console.log(numeros.splice(1, 3)); // → [2, 3, 4]  numeros agora é [1, 5]

Copiar de verdade

const original = ["Ana", "João"];

const referencia = original; // NÃO é cópia
referencia.push("Maria");
console.log(original); // → ["Ana", "João", "Maria"]  ← mudou!

const copia = [...original]; // cópia de verdade
copia.push("Carlos");
console.log(original); // → ["Ana", "João", "Maria"]  ← intacto

Atribuir um array a outra variável copia a referência, e não o conteúdo: as duas passam a apontar para a mesma lista na memória.

Procurar

const alunos = ["Ana", "João", "Maria"];

console.log(alunos.includes("João")); // → true
console.log(alunos.indexOf("Maria")); // → 2
console.log(alunos.indexOf("Pedro")); // → -1  (não achou)

const produtos = [
  { nome: "Farinha", precoEmCentavos: 1250 },
  { nome: "Açaí", precoEmCentavos: 2500 },
];

const acai = produtos.find((p) => p.nome === "Açaí");
console.log(acai); // → { nome: "Açaí", ... }

const posicao = produtos.findIndex((p) => p.nome === "Açaí");
console.log(posicao); // → 1

console.log(produtos.some((p) => p.precoEmCentavos > 2000)); // → true, algum
console.log(produtos.every((p) => p.precoEmCentavos > 2000)); // → false, todos

Ordenar

const nomes = ["João", "Ana", "Maria"];
nomes.sort();
console.log(nomes); // → ["Ana", "João", "Maria"]

const numeros = [10, 9, 100, 2];
numeros.sort();
console.log(numeros); // → [10, 100, 2, 9]  ← ordenou como texto!

numeros.sort((a, b) => a - b);
console.log(numeros); // → [2, 9, 10, 100]

Por padrão, sort compara como texto. Para número, passe a função de comparação: (a, b) => a - b do menor ao maior, (b, a) => b - a ao contrário.

Para texto em português, com acento:

const nomes = ["Ângela", "Ana", "Zé"];
nomes.sort((a, b) => a.localeCompare(b, "pt-BR"));
console.log(nomes); // → ["Ana", "Ângela", "Zé"]

Sem localeCompare, "Ângela" iria parar depois de "Zé", porque o código do "Â" é maior que o do "Z".

Juntar e separar

const alunos = ["Ana", "João", "Maria"];
console.log(alunos.join(", ")); // → "Ana, João, Maria"

const linha = "farinha,acai,tucuma";
console.log(linha.split(",")); // → ["farinha", "acai", "tucuma"]

A lista de chamada

const CHAMADA = ["Ana Souza", "Carlos Lima", "João Pereira", "Maria Santos"];

console.log(`Turma com ${CHAMADA.length} alunos`);

for (const [indice, aluno] of CHAMADA.entries()) {
  console.log(`${indice + 1}. ${aluno}`);
}

const presentes = [...CHAMADA];
const faltou = presentes.splice(presentes.indexOf("Carlos Lima"), 1);

console.log(`Faltou: ${faltou[0]}`);
console.log(`Presentes: ${presentes.join(", ")}`);
console.log(`Original intacto: ${CHAMADA.length} alunos`);

Exercícios

1. Crie uma lista com cinco nomes e mostre o primeiro, o último e o total.
2. Acrescente um no fim e outro no começo.
3. Ordene em ordem alfabética com localeCompare.
4. Ordene uma lista de preços do menor ao maior.
5. Copie a lista, altere a cópia e confirme que o original ficou intacto.
6. Procure um produto pelo nome numa lista de objetos.
7. Junte a lista numa frase com join(", ").

Referências

• Arrays - MDN - a introdução
• Array - MDN - todos os métodos, com o que altera e o que não altera
• localeCompare - MDN - ordenar com acento