Iteração através das propriedades do objeto

29 нояб. Situado por Rafay Nov 29 2011-11-29 17:30 '11 às 5:30 pm 2011-11-29 17:30
@ 27 respostas

A iteração por propriedades requer uma verificação adicional de hasOwnProperty :

 for (var property in object) { if (object.hasOwnProperty(property)) { // do stuff } } 

Isso é necessário porque o objeto de protótipo 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 do object .

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

2167
24 мая '13 в 15:38 2013-05-24 15:38 a resposta é dada por Dominik em 24 de maio de 2013 às 15:38 2013-05-24 15:38

A partir do JavaScript 1.8.5, você pode usar Object.keys(obj) para obter uma matriz de propriedades definidas no próprio objeto (aquelas que retornam true para 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.

border=0

Suportado nestes navegadores:

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

Veja a Referência do Objeto Mozilla Developer Network Object.keys () para mais informações.

894
13 авг. a resposta é dada Danny R 13 ago. 2013-08-13 10:19 '13 às 10:19 2013-08-13 10:19

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

Você pode ler isto como FOR cada propriedade IN do objeto obj , atribuindo a cada propriedade uma variável PROPT , por sua vez. "

193
29 нояб. A resposta é dada por Marc B 29 nov. 2011-11-29 17:32 '11 às 17:32 2011-11-29 17:32

Garotas e garotos, estamos em 2017, e não temos muito tempo para entrar ... Então, vamos fazer este novo ECMAScript 2016:

 Object.keys(obj).forEach(e => console.log('key=${e} value=${obj[e]}')); 
185
22 нояб. A resposta é dada por Frank Roth em 22 de novembro. 2016-11-22 11:47 '16 às 11:47 2016-11-22 11:47

Em versões futuras do ES, você pode usar Object.entries :

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

ou

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

Se você quiser apenas percorrer os valores, use Object.values:

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

ou

 Object.values(obj).forEach(value => ...) 
75
13 сент. Resposta dada por user663031 Set 13 2016-09-13 09:41 '16 às 9:41 am 2016-09-13 09:41

Este é apenas um for...in loop. Confira a documentação no Mozilla .

36
29 нояб. A resposta é dada por Matt Ball em 29 de novembro 2011-11-29 17:33 '11 às 17:33 2011-11-29 17:33

jquery permite que você faça isso agora:

 $.each( obj, function( key, value ) { alert( key + ": " + value ); }); 
22
29 марта '16 в 18:19 2016-03-29 18:19 a resposta é dada por Rob Sedgwick em 29 de março '16 às 18:19 2016-03-29 18:19
 for (property in object) { ... } 
22
10 мая '13 в 1:58 2013-05-10 01:58 Resposta é dada por Rose Perrone em 10 de maio de 2013 às 1:58 2013-05-10 01:58

A resposta de Dominic é perfeita, eu prefiro fazê-lo de uma maneira que seja mais limpa de se ler:

 for (var property in object) { if (!object.hasOwnProperty(property)) continue; // Do stuff... } 
17
19 янв. a resposta é dada por Cyril N. 19 jan. 2018-01-19 14:03 '18 às 2:03 pm 2018-01-19 14:03

As respostas acima são um pouco chatas, porque não explicam o que você faz dentro do loop for depois de fornecer um objeto: VOCÊ NÃO ESTÁ DISPONÍVEL DIRETAMENTE! Você na verdade só entregou a CHAVE que você 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 é seguro para o ECMA5. Até funciona em versões coxas do JS, como o Rhino;)

14
28 окт. Resposta dada por dylanh724 28 de out 2017-10-28 08:39 '17 às 8:39 2017-10-28 08:39

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

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

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

O método Object.entries () retorna uma matriz de pares próprios de elementos enumeráveis [key, value] pertencentes ao objeto dado na mesma ordem que no loop for ... in (a diferença é que o número de ciclos for-in enumera as propriedades em cadeia de protótipos).

Basicamente, com Object.entries podemos abandonar a próxima etapa adicional que é necessária para a mais antiga ... Em loop:

 // This step is not necessary with Object.entries if (object.hasOwnProperty(property)) { // do stuff } 
12
08 окт. a resposta é dada JSON C11 08 oct. 2017-10-08 00:27 '17 às 0:27 2017-10-08 00:27

O loop for ... in representa cada propriedade em um objeto, porque parece um loop for. Você definiu um propt em um loop for ... in executando:

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

E para ... o loop percorre as propriedades enumeradas do objeto. Qualquer variável que você defina ou insira em um loop for ..., toda vez que for para a próxima propriedade, itera. A variável no loop for ... in itera pelas chaves, mas o valor desse valor é um valor de 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 para um ... loop faz o oposto.

Espero que isso ajude.

11
24 янв. a resposta é dada pela Vappor Washmade 24 jan. 2016-01-24 06:57 '16 às 6:57 2016-01-24 06:57
 let obj = {"a": 3, "b": 2, "6": "a"} Object.keys(obj).map((item) => {console.log("item", obj[item])}) // a // 3 // 2 
10
05 мая '17 в 21:30 2017-05-05 21:30 respondeu a Philll_t May 05 '17 às 21:30 2017-05-05 21:30

Para adicionar ES2015 usando Reflect.ownKeys(obj) , bem como iterar propriedades através de um iterador.

Por exemplo:

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

pode ser repetido

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

Se você deseja iterar diretamente sobre os valores da chave do objeto, é possível definir um iterator , como os iteradores padrão para JavaScipts para cadeias de caracteres, matrizes, matrizes digitadas, Mapear e Definir.

O JS tentará iterar usando a propriedade do iterador padrão, que deve ser definida como Symbol.iterator .

Se você quiser ser capaz de iterar todos os objetos, você pode adicioná-lo como um objeto de protótipo:

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

Isso permitirá que você repita os valores de um objeto usando um loop for ...

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

Atenção : desde que escrevi esta resposta (junho de 2018) todos os outros navegadores, mas o IE, suportam geradores e for...of iteração através do Symbol.iterator

10
28 июня '18 в 15:49 2018-06-28 15:49 a resposta é dada por Dimitar Nikovski em 28 de junho '18 às 15:49 2018-06-28 15:49

Você pode usar o Lodash. Documentação

 var obj = {a: 1, b: 2, c: 3}; _.keys(obj).forEach(function (key) { ... }); 
10
04 нояб. resposta dada por viktarpunko 04 nov 2016-11-04 19:51 '16 às 19:51 2016-11-04 19:51

Seu loop for itera através de todas as propriedades do objeto obj . propt definido na primeira linha do loop for. Esta é uma string que é o nome de uma propriedade de um objeto obj . Na primeira iteração do loop propt , haverá um "nome".

8
29 нояб. a resposta é dada por arb Nov 29 2011-11-29 17:33 '11 às 17:33 2011-11-29 17:33

Atualmente, você pode converter um objeto JS padrão em um objeto iterável, simplesmente adicionando o método Symbol.iterator. Então você pode usar o for of loop e usar seus valores diretamente ou até mesmo usar o operador spread no objeto. Legal. Vamos ver como podemos fazer isso:

09 авг. a resposta é dada para Redu 09 ago. 2016-08-09 13:43 '16 at 1:43 pm 2016-08-09 13:43

Objetos em JavaScript são conjuntos de propriedades e, portanto, podem ser codificados em cada instrução.

Você deve pensar em obj como um conjunto de valores-chave.

8
29 нояб. A resposta é dada por user920041 Nov. 29. 2011-11-29 17:34 '11 às 17:34 2011-11-29 17:34
 Object.keys(obj).forEach(key => console.log('key=${key} value=${obj[key]}') ); 
8
25 апр. A resposta é dada Fellow Stranger 25 de abril 2018-04-25 14:02 '18 às 2:02 pm 2018-04-25 14:02

Também adicionando um método recursivo:

 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]); } } } } } 

Use:

 iterate({ foo: "foo", bar: { foo: "foo"} }); 
4
11 февр. A resposta é dada por Ondrej Svejdar 11 de fevereiro 2016-02-11 18:09 '16 às 6:09 pm 2016-02-11 18:09

Você basicamente deseja iterar sobre 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); 
3
23 июня '16 в 22:53 2016-06-23 22:53 a resposta é dada pela HovyTech em 23 de junho às 16:53 2016-06-23 22:53

Se você estiver usando um , recomendo:

 Object.keys(obj).forEach((key, index) => { console.log(key); }); 
3
11 авг. Justin respondeu em 11 de agosto 2017-08-11 07:37 '17 às 7:37 am 2017-08-11 07:37

O que é para um loop if .. é que ele cria uma nova variável (var someVariable) e depois salva cada propriedade do objeto dado nessa nova variável (someVariable) uma após a outra. 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 
2
29 марта '15 в 11:48 2015-03-29 11:48 a resposta é dada por Raman Sohi em 29 de março de 2015 às 11:48 2015-03-29 11:48

Eu quero adicionar as respostas acima, porque você pode ter diferentes intenções do Javascript. O objeto JSON e o objeto Javascript são coisas diferentes, e você pode querer iterar pelas propriedades do objeto JSON usando as soluções propostas acima e, em seguida, ficar surpreso.

Suponha que você tenha um objeto JSON, por exemplo:

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

Caminho errado para percorrer suas propriedades:

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

Você pode se surpreender ao ver o log do console 0 , 1 , etc. quando repetido usando propriedades prop1 e prop2 e prop3_1 . Esses objetos são seqüências e índices de seqüência são propriedades desse objeto em Javascript.

A melhor maneira de iterar recursivamente pelas propriedades de um objeto JSON é 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]); } } } 
2
28 янв. Resposta dada por Jadiel de Armas em 28 de janeiro 2016-01-28 23:41 '16 às 11:41 pm 2016-01-28 23:41

Aqui eu repito cada nó e crie nomes de nós significativos. Se você notar, o instanceOf Array e o instanceOf Object praticamente fazem a mesma coisa (no meu aplicativo eu uso 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 Eu sou inspirado pela resposta Ondrei Shveyar. Mas esta solução tem melhor desempenho e menos ambígua

2
21 февр. a resposta é dada por Faiz Mohamed Haneef 21 fev. 2016-02-21 19:40 '16 às 19:40 2016-02-21 19:40

Para esclarecer a resposta aceita, vale a pena notar que, se você criar uma instância de objeto com var object = Object.create(null) , então object.hasOwnProperty(property) chamará um TypeError. Para ser seguro, você precisa chamá-lo do protótipo da seguinte forma:

 for (var property in object) { if (Object.prototype.hasOwnProperty.call(object, property)) { // do stuff } } 
1
29 авг. a resposta é dada Konrad Kiss 29 ago. 2017-08-29 10:36 '17 às 10:36 am 2017-08-29 10:36

Você pode usá-lo para obter ou definir o valor de um objeto ou uma matriz com objetos. https://jsfiddle.net/narendra_globalsysinfo/yt97dbm5/

 var reset = function(data){ for( var prop in data){ if(typeof data[prop] === 'object') { data[prop] = reset(data[prop]); } else{ if(typeof data[prop] !== 'function'){ var dataType = typeof data[prop]; var returnType = null; switch(dataType){ case 'number': returnType = 0; break; case 'string': returnType = ''; break; case 'boolean': returnType = false; break; default: break; } data[prop] = returnType; } } } return data; } var obj = { p1:{ p11:1,p12:'Hi'},p2:1,p3:function(){console.log('hi')} }; obj = reset(obj); 

Ele retornará o mesmo objeto com o valor padrão.

Padrão: para int é 0, para a string é '' e para boolean - false

Nota: um objeto com uma função como uma propriedade não será redefinido, você pode fazer alterações de acordo com os requisitos e me agradecer.

0
03 дек. A resposta é dada por Narendra Singh Rathore 03 de dezembro. 2017-12-03 05:15 '17 às 5:15 am 2017-12-03 05:15

Outras perguntas sobre tags ou Faça uma pergunta