Iteração sobre objetos em JavaScript: análise completa para iniciantes

Como percorrer as propriedades de um objeto em JavaScript: do iniciante ao profissional

Todo desenvolvedor que escreve em JavaScript, mais cedo ou mais tarde, se depara com a tarefa: "Como faço para percorrer todas as propriedades de um objeto?". Se você está acostumado a trabalhar com arrays, onde existem for, forEach e map, os objetos podem parecer complicados. Mas não se preocupe! Neste artigo, vamos analisar todas as formas de iteração sobre um objeto em JavaScript — desde o clássico for...in até os modernos Object.keys(), Object.values() e Object.entries().

Não vamos apenas mostrar a sintaxe. Vamos analisar qual método escolher para cada tarefa específica, quais armadilhas existem e como não cair em problemas com propriedades herdadas. Vamos lá!

O que é um objeto em JavaScript e por que é necessário percorrê-lo?

Um objeto é uma coleção de pares "chave: valor". Diferente de um array, onde os elementos são ordenados por índice, em um objeto a ordem das propriedades não é garantida (embora os motores modernos tentem preservá-la).

Imagine que você tem um objeto com dados de usuário:

const user = {\n  name: 'Ana',\n  age: 28,\n  city: 'Moscou',\n  isAdmin: false\n};

Você precisa exibir todos os dados na tela, enviá-los para o servidor ou apenas calcular algo. Sem iteração, você teria que escrever user.name, user.age, etc. — isso não é flexível nem escalável. E se o objeto tiver 50 propriedades? É aí que os métodos de iteração são úteis.

Método nº1: Clássico for...in

A maneira mais antiga e direta de percorrer as propriedades de um objeto é usar o loop for...in. Ele foi criado especificamente para objetos.

const user = {\n  name: 'Ana',\n  age: 28,\n  city: 'Moscou'\n};\n\nfor (let key in user) {\n  console.log(key + ': ' + user[key]);\n}\n// Saída:\n// name: Ana\n// age: 28\n// city: Moscou

Aqui, key é o nome da propriedade (valor string) e user[key] é o seu valor.

Importante! for...in percorre não apenas as propriedades próprias do objeto, mas também aquelas herdadas através da cadeia de protótipos. Isso pode levar a resultados inesperados, especialmente se você estendeu os protótipos de objetos embutidos (o que não é recomendado, mas pode acontecer).

Para evitar isso, use o método hasOwnProperty:

for (let key in user) {\n  if (user.hasOwnProperty(key)) {\n    console.log(key + ': ' + user[key]);\n  }\n}

Uma alternativa moderna é Object.hasOwn() (ES2022):

for (let key in user) {\n  if (Object.hasOwn(user, key)) {\n    console.log(key + ': ' + user[key]);\n  }\n}

Quando usar for...in? Quando você precisa dos nomes das propriedades (chaves) e tem certeza de que não encontrará propriedades herdadas. Ou quando você está trabalhando com objetos simples criados com literal {}.

Método nº2: Object.keys() — obtendo um array de chaves

O método Object.keys() retorna um array das propriedades enumeráveis próprias (não herdadas) do objeto. Esta é a maneira mais popular e segura de iteração atualmente.

const user = {\n  name: 'Ana',\n  age: 28,\n  city: 'Moscou'\n};\n\nconst keys = Object.keys(user);\nconsole.log(keys); // ['name', 'age', 'city']\n\n// Agora você pode usar forEach ou for...of\nkeys.forEach(key => {\n  console.log(key + ': ' + user[key]);\n});

Vantagem: você obtém um array comum, com o qual pode fazer tudo — filtrar, mapear, ordenar.

Exemplo com filtragem:

const filteredKeys = Object.keys(user).filter(key => key !== 'isAdmin');\nfilteredKeys.forEach(key => console.log(user[key]));

Quando usar Object.keys()? Praticamente sempre que você precisa percorrer as propriedades de um objeto e não precisa se preocupar com herança. É a escolha mais segura e previsível.