Iterando objetos: percorrendo as 'chaves' e 'valores'

Aprenda a visitar cada propriedade de um objeto para realizar alguma ação.

Até aqui, você aprendeu a criar, acessar, adicionar e remover propriedades em objetos.
Agora chegou a hora de aprender a percorrer um objeto inteiro, passando por cada informação.

Isso se chama iterar objeto.

Analogia simples

Pense em uma ficha de cadastro:

  • nome: Ana
  • idade: 25
  • cidade: Recife

Iterar é como ler campo por campo da ficha, em sequência, sem pular nenhum.

Objeto de exemplo

const pessoa = {
  nome: "Ana",
  idade: 25,
  cidade: "Recife"
};

1) Usando for...in (forma clássica)

for...in percorre as chaves de um objeto.

for (let chave in pessoa) {
  console.log(chave); // nome, idade, cidade
}

Se você quiser o valor de cada chave:

for (let chave in pessoa) {
  console.log(chave, pessoa[chave]);
}

Repare que usamos pessoa[chave] (colchetes), porque chave é variável.

2) Usando Object.keys()

Object.keys(obj) devolve um array com as chaves.

const chaves = Object.keys(pessoa);
console.log(chaves); // ["nome", "idade", "cidade"]

Como vira array, você pode usar forEach:

Object.keys(pessoa).forEach(function(chave) {
  console.log(chave, pessoa[chave]);
});

3) Usando Object.values()

Object.values(obj) devolve um array com os valores.

const valores = Object.values(pessoa);
console.log(valores); // ["Ana", 25, "Recife"]

4) Usando Object.entries()

Object.entries(obj) devolve pares [chave, valor].

const pares = Object.entries(pessoa);
console.log(pares);
// [["nome", "Ana"], ["idade", 25], ["cidade", "Recife"]]

Com for...of:

for (let [chave, valor] of Object.entries(pessoa)) {
  console.log(chave, valor);
}

Essa é uma forma muito clara para ler chave e valor ao mesmo tempo.

Quando usar cada abordagem?

  • for...in: simples e direto para percorrer chaves.
  • Object.keys(): quando você quer trabalhar só com chaves como array.
  • Object.values(): quando só os valores importam.
  • Object.entries(): ótima quando você precisa de chave e valor juntos.

Cuidado importante

Em objetos simples de estudo, tudo funciona bem de forma direta.
Em projetos maiores, é comum validar a origem dos dados e evitar percorrer propriedades inesperadas.

Exemplo prático: mostrando dados na tela

Imagine que você quer exibir uma ficha de usuário no console:

const usuario = {
  nome: "Bruno",
  email: "bruno@email.com",
  ativo: true
};

for (let [campo, valor] of Object.entries(usuario)) {
  console.log(campo + ": " + valor);
}

Saída:

Resumo da lição

  • Iterar objeto é percorrer suas chaves e valores.
  • for...in percorre chaves.
  • Object.keys() retorna chaves em array.
  • Object.values() retorna valores em array.
  • Object.entries() retorna pares chave/valor.
  • Para chave dinâmica, use colchetes: obj[chave].