Loop pelas propriedades de um objeto. (#Javascript, #js, #dev, #loop)

Olá, programadores! No post de hoje, vou compartilhar com vocês um guia prático sobre como navegar pelas chaves e valores de um objeto em JavaScript. Vou mostrar duas abordagens fáceis: utilizando a sintaxe tradicional for…in e a moderna técnica de Object.keys. Se você está procurando dicas para manipular objetos e otimizar seu código, veio ao lugar certo. Vamos juntos desvendar essas técnicas!

Neste post mostro duas formas de fazer um loo pe passar por todas as chaves/propriedades de um objeto javascript.Para os dois exemplos, considere o objeto abaixo:

const foo = {
    bar: 42,
    other: "thing",
    email: "a@email.com"
}

Utilizando a sintaxe for…in

for (const key in foo) {
  console.log("Key:" + key, "Value: " + foo[key]);
}

O loop acima vai retornar chave a chave do objeto. Com estas informações, você consegue acessar os valores do objeto.

Utilizando Object.keys

const keys = Object.keys(foo);

O código acima retorna um array com as chaves do objeto. A partir daí, você pode fazer uma iteração pelo vetor e acessar os valores.

Exemplo:

keys.forEach(key => {
   console.log("Key:" + key, "Value: " + foo[key]);
});

//alternative
Object.keys(foo).forEach(key => {
   console.log("Key:" + key, "Value: " + foo[key]);
});

Nestes dois últimos exemplos, utilizei a função forEach para fazer a iteração pelas chaves obtidas com o Object.keys(foo).

Fiz um exemplo deste post no JSFiddle.

Espero ter ajudado!