Objetos

Um objeto agrupa valores relacionados sob nomes. Em { name: "Coco", age: 3 }, pet.name dá "Coco" e pet.age dá 3.

Valores com rótulos

Um array é bom para uma lista de coisas parecidas em ordem. Muita coisa no mundo é mais bem descrita por um conjunto de fatos com rótulo: um bicho de estimação tem nome, espécie e idade; um produto tem título, preço e quantidade em estoque. Um objeto guarda exatamente isso. Ele é uma coleção de propriedades, e cada propriedade é uma chave (o rótulo) junto com um valor.

const pet = {
  name: "Coco",
  kind: "cat",
  age: 3,
};
console.log(pet.name);        // mostra Coco
console.log(pet["kind"]);     // mostra cat
console.log(pet.age + 1);     // mostra 4

Um objeto se escreve entre chaves, com cada propriedade na forma key: value e vírgulas entre elas. Uma vírgula sobrando depois da última propriedade é permitida. Para ler uma propriedade, escreva o objeto, um ponto e a chave: pet.name. A outra forma usa colchetes e uma string, pet["kind"]. Os colchetes são necessários quando a chave está guardada numa variável, como em pet[field], ou quando ela tem um espaço. Ler uma chave que não existe dá undefined.

Mudando e acrescentando propriedades

Atribua a uma propriedade para mudá-la, e atribua a uma chave nova para acrescentar uma. Como nos arrays, isso funciona mesmo quando o objeto foi declarado com const, porque a variável continua apontando para o mesmo objeto.

const player = { name: "Sam", score: 0 };
player.score += 10;
player.level = 2;
console.log(`${player.name} ${player.score} ${player.level}`);   // mostra Sam 10 2
delete player.level;
console.log(player.level);   // mostra undefined

Listas de objetos

Arrays e objetos se combinam naturalmente. Um array de objetos é como a maioria dos programas guarda registros: um carrinho de compras, uma lista de chamada, um conjunto de resultados de busca. Você percorre o array e lê as propriedades de que precisa em cada objeto.

const basket = [
  { item: "pen", price: 2 },
  { item: "book", price: 12 },
  { item: "bag", price: 25 },
];
let total = 0;
for (const line of basket) {
  total += line.price;
}
console.log("Total:", total);   // mostra Total: 39

Os valores dentro de um objeto podem ser qualquer coisa, inclusive arrays e outros objetos. const user = { name: "Ana", tags: ["admin", "editor"] }; deixa você escrever user.tags[0] para chegar a "admin". Leia essas cadeias da esquerda para a direita: comece em user, vá para a propriedade tags dele e depois pegue o índice 0.

Métodos e as chaves de um objeto

Uma propriedade cujo valor é uma função se chama método. Você vem chamando métodos desde o começo: console.log é o método log do objeto console, e Math.round é o método round de Math. Dentro de um método, a palavra-chave this se refere ao objeto em que o método foi chamado, então um método pode ler as propriedades do próprio objeto. Por fim, Object.keys(pet) dá um array com as chaves, aqui ["name", "kind", "age"], o que é útil para percorrer todas as propriedades.

const counter = {
  count: 0,
  add() {
    this.count++;
  },
};
counter.add();
counter.add();
console.log(counter.count);   // mostra 2

Exemplo resolvido. Um registro de livro { title: "Notes", pages: 120, read: 45 } pode informar o progresso com Math.round(book.read / book.pages * 100), que dá 38, ou seja, 38 por cento. Chamar os valores de pages e read deixa a fórmula legível de um jeito que b[1] / b[0] nunca deixaria.

Array ou objeto?

Um teste rápido decide qual usar. Se os valores são do mesmo tipo de coisa e a ordem importa, como as notas de uma turma ou os passos de uma receita, use um array e chegue a eles pela posição. Se os valores são fatos diferentes sobre uma coisa só, como o nome, o preço e o estoque de um produto, use um objeto e chegue a eles pelo nome. A maioria dos dados reais mistura os dois: um array de produtos, em que cada produto é um objeto. Quando você mostra um objeto na caixa de prática, ele aparece numa forma compacta como {"name":"Coco","age":3}; ler propriedades isoladas dá uma saída mais limpa.