Iterar pelas propriedades do objeto

var obj = {
    name: "Simon",
    age: "20",
    clothing: {
        style: "simple",
        hipster: false
    }
}

for(var propt in obj){
    console.log(propt + ': ' + obj[propt]);
}

Como a variável proptrepresenta as propriedades do objeto? Não é um método ou propriedade interno. Por que ele cria todas as propriedades do objeto?

A iteração sobre propriedades requer esta hasOwnPropertyverificação adicional :

for (var prop in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, prop)) {
        // do stuff
    }
}

É necessário porque o protótipo de um objeto contém propriedades adicionais para o objeto que são tecnicamente parte do objeto. Essas propriedades adicionais são herdadas da classe de objeto base, mas ainda são propriedades de obj.

hasOwnProperty simplesmente verifica se essa é uma propriedade específica dessa classe e não herdada da classe base.

Também é possível chamar hasOwnPropertyatravés do próprio objeto:

if (obj.hasOwnProperty(prop)) {
    // do stuff
}

Mas isso falhará se o objeto tiver um campo não relacionado com o mesmo nome:

var obj = { foo: 42, hasOwnProperty: 'lol' };
obj.hasOwnProperty('foo');  // TypeError: hasOwnProperty is not a function

É por isso que é mais seguro fazê-lo Object.prototype:

var obj = { foo: 42, hasOwnProperty: 'lol' };
Object.prototype.hasOwnProperty.call(obj, 'foo');  // true

No JavaScript 1.8.5, você pode usar Object.keys(obj)para obter uma matriz de propriedades definida no próprio objeto (aquelas que retornam verdadeiras obj.hasOwnProperty(key)).

Object.keys(obj).forEach(function(key,index) {
    // key: the name of the object key
    // index: the ordinal position of the key within the object 
});

Isso é melhor (e mais legível) do que usar um loop for-in.

É suportado nestes navegadores:

• Firefox (Gecko): 4 (2.0)
• Chrome: 5
• Internet Explorer: 9

Veja o Mozilla Developer Network Object.keys () 's de referência para mais informações.

Garotas e garotos que estamos em 2019 e não temos muito tempo para digitar ... Então, vamos fazer este novo ECMAScript 2016 chique e legal:

Object.keys(obj).forEach(e => console.log(`key=${e}  value=${obj[e]}`));

É o for...in statement( MDN , especificação ECMAScript ).

Você pode lê-lo como " PARA cada propriedade IN do objobjeto, atribuir a cada estabelecimento até o propt variável por sua vez".

Nas implementações atualizadas do ES, você pode usar Object.entries:

for (const [key, value] of Object.entries(obj)) { }

ou

Object.entries(obj).forEach(([key, value]) => ...)

Se você deseja iterar sobre os valores, use Object.values:

for (const value of Object.values(obj)) { }

ou

Object.values(obj).forEach(value => ...)

É apenas um for...inloop. Confira a documentação no Mozilla .

Se o seu ambiente suportar o ES2017 , eu recomendaria o Object.entries :

Object.entries(obj).forEach(([key, value]) => {
  console.log(`${key} ${value}`);
});

Conforme mostrado na documentação do Mozillas Object.entries () :

O método Object.entries () retorna uma matriz dos pares de propriedades [chave, valor] da propriedade enumerável de um determinado objeto, na mesma ordem que a fornecida por um loop for ... in (a diferença é que um loop for enumera propriedades na cadeia de protótipos).

Basicamente, com Object.entries, podemos abrir mão da seguinte etapa extra que é necessária com o loop for ... in mais antigo :

// This step is not necessary with Object.entries
if (object.hasOwnProperty(property)) {
  // do stuff
}

O jquery permite que você faça isso agora:

$.each( obj, function( key, value ) {
  alert( key + ": " + value );
});

A resposta de Dominik é perfeita, eu prefiro fazê-lo dessa maneira, pois é mais fácil ler:

for (var property in object) {
    if (!object.hasOwnProperty(property)) continue;

    // Do stuff...
}

As respostas acima são um pouco irritantes, porque elas não explicam o que você faz dentro do loop for depois de garantir que é um objeto: VOCÊ NÃO A ACEITA DIRETAMENTE! Na verdade, você recebeu apenas a CHAVE que precisa aplicar ao OBJ:

var obj = {
  a: "foo",
  b: "bar",
  c: "foobar"
};

// We need to iterate the string keys (not the objects)
for(var someKey in obj)
{
  // We check if this key exists in the obj
  if (obj.hasOwnProperty(someKey))
  {
    // someKey is only the KEY (string)! Use it to get the obj:
    var myActualPropFromObj = obj[someKey]; // Since dynamic, use [] since the key isn't literally named "someKey"

    // NOW you can treat it like an obj
    var shouldBeBar = myActualPropFromObj.b;
  }
}

Tudo isso é seguro para ECMA5. Até funciona nas versões lame JS como Rhino;)

Para adicionar o uso de ES2015 de Reflect.ownKeys(obj) e também iterar sobre as propriedades por meio de um iterador.

Por exemplo:

let obj = { a: 'Carrot', b: 'Potato', Car: { doors: 4 } };

pode ser iterado por

// logs each key
Reflect.ownKeys(obj).forEach(key => console.log(key));

Se você deseja iterar diretamente sobre os valores das chaves de um objeto, pode definir um iterator , assim como os iteradores padrão do JavaScipts para strings, matrizes, matrizes digitadas, Map e Set.

JS tentará iterar através da propriedade padrão do iterador, que deve ser definida como Symbol.iterator.

Se você deseja iterar sobre todos os objetos, pode adicioná-lo como um protótipo de Object:

Object.prototype[Symbol.iterator] = function*() { 
    for(p of Reflect.ownKeys(this)){ yield this[p]; }
}

Isso permitiria que você iterasse sobre os valores de um objeto com um loop for ... of, por exemplo:

for(val of obj) { console.log('Value is:' + val ) }

Cuidado : ao escrever esta resposta (junho de 2018), todos os outros navegadores, exceto o IE, suportam geradores e for...ofiteração viaSymbol.iterator

if(Object.keys(obj).length) {
    Object.keys(obj).forEach(key => {
        console.log("\n" + key + ": " + obj[key]);
    });
}

// *** Explanation line by line ***

// Explaining the bellow line
// It checks if obj has at least one property. Here is how:
// Object.keys(obj) will return an array with all keys in obj
// If there is no keys in obj, it will return empty array = []
// Then it will get it's length, if it has at least one element,
// it's bigger than 0 which evaluates to true and the bellow 
// code will be executed.
// Else means it's length = 0 which evaluates to false
// NOTE: you can use Object.hasOwnProperty() instead of Object.keys(obj).length
if(Object.keys(obj).length) {

    // Explaining the bellow line
    // Just like in the previous line, this returns an array with
    // all keys in obj (because if code execution got here, it means 
    // obj has keys.) 
    // Then just invoke built-in javascript forEach() to loop
    // over each key in returned array and calls a call back function 
    // on each array element (key), using ES6 arrow function (=>)
    // Or you can just use a normal function ((key) { blah blah }).
    Object.keys(obj).forEach(key => {

        // The bellow line prints out all keys with their 
        // respective value in obj.
        // key comes from the returned array in Object.keys(obj)
        // obj[key] returns the value of key in obj
        console.log("\n" + key + ": " + obj[key]);
    });
}

O loop for ... in representa cada propriedade em um objeto porque é como um loop for. Você definiu propt no loop for ... in, fazendo:

    for(var propt in obj){
alert(propt + ': ' + obj[propt]);
}

Um loop for ... in itera pelas propriedades enumeráveis ​​de um objeto. Qualquer variável que você definir ou colocar no loop for ... in será alterada cada vez que for para a próxima propriedade que itera. A variável no loop for ... in itera pelas chaves, mas o valor dela é o valor da chave. Por exemplo:

    for(var propt in obj) {
      console.log(propt);//logs name
      console.log(obj[propt]);//logs "Simon"
    }

Você pode ver como a variável difere do valor da variável. Em contraste, um loop for ... faz o oposto.

Eu espero que isso ajude.

let obj = {"a": 3, "b": 2, "6": "a"}

Object.keys(obj).map((item) => {console.log("item", obj[item])})

// a
// 3
// 2

Object.keys(obj).forEach(key =>
  console.log(`key=${key} value=${obj[key]}`)
);

Você pode usar o Lodash. A documentação

var obj = {a: 1, b: 2, c: 3};
_.keys(obj).forEach(function (key) {
    ...
});

Seu forloop está repetindo todas as propriedades do objeto obj. propté definido na primeira linha do seu loop for. É uma string que é o nome de uma propriedade do objobjeto. Na primeira iteração do loop, proptseria "nome".

Objetos em JavaScript são coleções de propriedades e, portanto, podem ser repetidos em um para cada instrução.

Você deve pensar objcomo uma coleção de valores-chave.

Atualmente, você pode converter um objeto JS padrão em um objeto iterável apenas adicionando um método Symbol.iterator. Em seguida, você pode usar um for ofloop e acessar seus valores diretamente ou até mesmo usar um operador de propagação no objeto. Legal. Vamos ver como podemos fazer isso:

var o = {a:1,b:2,c:3},
    a = [];
o[Symbol.iterator] = function*(){
                       var ok = Object.keys(this);
                            i = 0;
                       while (i < ok.length) yield this[ok[i++]];
                     };
for (var value of o) console.log(value);
// or you can even do like
a = [...o];
console.log(a);

Se estiver executando o Node , recomendo:

Object.keys(obj).forEach((key, index) => {
    console.log(key);
});

Embora a resposta com a melhor classificação esteja correta, aqui está um caso de uso alternativo, ou seja, se você estiver iterando sobre um objeto e quiser criar uma matriz no final. Use em .mapvez deforEach

const newObj = Object.keys(obj).map(el => {
    //ell will hold keys 
   // Getting the value of the keys should be as simple as obj[el]
})

Também adicionando a maneira recursiva:

function iterate(obj) {
    // watch for objects we've already iterated so we won't end in endless cycle
    // for cases like var foo = {}; foo.bar = foo; iterate(foo);
    var walked = [];
    var stack = [{obj: obj, stack: ''}];
    while(stack.length > 0)
    {
        var item = stack.pop();
        var obj = item.obj;
        for (var property in obj) {
            if (obj.hasOwnProperty(property)) {
                if (typeof obj[property] == "object") {
                  // check if we haven't iterated through the reference yet
                  var alreadyFound = false;
                  for(var i = 0; i < walked.length; i++)
                  {
                    if (walked[i] === obj[property])
                    {
                      alreadyFound = true;
                      break;
                    }
                  }
                  // new object reference
                  if (!alreadyFound)
                  {
                    walked.push(obj[property]);
                    stack.push({obj: obj[property], stack: item.stack + '.' + property});
                  }
                }
                else
                {
                    console.log(item.stack + '.' + property + "=" + obj[property]);
                }
            }
        }
    }
}

Uso:

iterate({ foo: "foo", bar: { foo: "foo"} }); 

O que o loop for..in faz é que ele cria uma nova variável (var someVariable) e, em seguida, armazena cada propriedade do objeto especificado nessa nova variável (someVariable) uma por uma. Portanto, se você usar o bloco {}, poderá iterar. Considere o seguinte exemplo.

var obj = {
     name:'raman',
     hobby:'coding',
     planet:'earth'
     };

for(var someVariable in obj) {
  //do nothing..
}

console.log(someVariable); // outputs planet

Aqui, eu estou iterando cada nó e criando nomes significativos de nós. Se você notar, instanceOf Array e instanceOf Object praticamente fazem a mesma coisa (no meu aplicativo, estou fornecendo uma lógica diferente)

function iterate(obj,parent_node) {
    parent_node = parent_node || '';
    for (var property in obj) {
        if (obj.hasOwnProperty(property)) {
            var node = parent_node + "/" + property;
            if(obj[property] instanceof Array) {
                //console.log('array: ' + node + ":" + obj[property]);
                iterate(obj[property],node)
            } else if(obj[property] instanceof Object){
                //console.log('Object: ' + node + ":" + obj[property]);
                iterate(obj[property],node)
            }
            else {
                console.log(node + ":" + obj[property]);
            }
        }
    }
}

nota - Estou inspirado na resposta de Ondrej Svejdar. Mas esta solução tem melhor desempenho e menos ambígua

Você basicamente deseja percorrer cada propriedade no objeto.

JSFiddle

var Dictionary = {
  If: {
    you: {
      can: '',
      make: ''
    },
    sense: ''
  },
  of: {
    the: {
      sentence: {
        it: '',
        worked: ''
      }
    }
  }
};

function Iterate(obj) {
  for (prop in obj) {
    if (obj.hasOwnProperty(prop) && isNaN(prop)) {
      console.log(prop + ': ' + obj[prop]);
      Iterate(obj[prop]);
    }
  }
}
Iterate(Dictionary);

Quero adicionar as respostas acima, porque você pode ter intenções diferentes do Javascript. Um objeto JSON e um objeto Javascript são coisas diferentes, e você pode querer percorrer as propriedades de um objeto JSON usando as soluções propostas acima e, em seguida, surpreender-se.

Suponha que você tenha um objeto JSON como:

var example = {
    "prop1": "value1",
    "prop2": [ "value2_0", value2_1"],
    "prop3": {
         "prop3_1": "value3_1"
    }
}

A maneira errada de iterar através de suas 'propriedades':

function recursivelyIterateProperties(jsonObject) {
    for (var prop in Object.keys(example)) {
        console.log(prop);
        recursivelyIterateProperties(jsonObject[prop]);
    }
}

Você pode ser surpreendido de ver o registro do console 0, 1etc., quando a iteração através das propriedades prop1e prop2eprop3_1 . Esses objetos são sequências e os índices de uma sequência são propriedades desse objeto em Javascript.

Uma maneira melhor de iterar recursivamente através das propriedades de um objeto JSON seria primeiro verificar se esse objeto é uma sequência ou não:

function recursivelyIterateProperties(jsonObject) {
    for (var prop in Object.keys(example)) {
        console.log(prop);
        if (!(typeof(jsonObject[prop]) === 'string')
            && !(jsonObject[prop] instanceof Array)) {
                recursivelyIterateProperties(jsonObject[prop]);

            }

     }
}

Para refinar ainda mais a resposta aceita, vale a pena notar que, se você instanciar o objeto com um var object = Object.create(null), object.hasOwnProperty(property)acionará um TypeError. Portanto, para estar do lado seguro, você precisa chamá-lo do protótipo assim:

for (var property in object) {
    if (Object.prototype.hasOwnProperty.call(object, property)) {
        // do stuff
    }
}

Verifique este link que ajudará https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_state_forin

var person = {fname:"John", lname:"Doe", age:25}; 

  var text = "";
  var x;
  for (x in person) {
    text += person[x] + " "; // where x will be fname,lname,age
   }
Console.log(text);